如何在编辑其中一个单元格时更新 ng2-智能表值?

Question

在我的应用程序中，我正在使用akveo/ng-2-smart-table.在其中一列中，我使用带有 HTML 元素select自定义组件从我的数据中选择一个项目。当我选择一个元素时，我想更新其行中另一个单元格的值。

我该怎么做？

例如，这是我的组件：

@Component({
selector: 'ngx-template-field-select',
template: `
<div class="form-group">
<select
name="fields"
class="form-control"
(change)="onChange()">
<option *ngFor="let field of fields"
[value]="field.id">{{ field.name }}</option>
</select>
</div>
`,
})
export class EditTemplateFieldComponent extends DefaultEditor implements OnInit {
@Input()
public value: string;
@Input()
public rowData: any;
public fields = [];
constructor(
public fieldsService: FieldsService,
) {
super();
}
public ngOnInit(): void {
this.fieldsService.getEntityList().subscribe(
(value: FieldType[]) => {
this.fields = value;
});
}
onChange() {
this.cell.setValue(this.value);
}
}

Answer 1

在您的组件中

obj = {
id: '',
name: ''
}
constructor(private fb: FormBuilder) {
this.demoForm = this.fb.group({
fields: []
});
}
// You can look for the value changes of select, which you can subscribe to
this.demoForm.valueChanges.subscribe(
id => {
if(id) {
this.countries.forEach(value => {
if(value.id === id) {
this.obj = value;
}
})
} else {
this.obj = null; // or assign for empty object
}

在您看来

<div class="form-group">
<form [formGroup]="demoForm">
<select formControlName="fields"
name="fields"
class="form-control">
<option *ngFor="let field of fields"
[value]="field.id">{{ field.name }}</option>
</select>
</div>
<p>{{obj | json}}</p>

希望这有所帮助，并且您了解开始的想法...