0

我ngx-chips在我的 Angular 8 项目之一中使用。当我在“编辑”表单 (ngForm) 中时，我看到tag-input选择了 Genre 的名称。但是，我无法提交表单，因为它显示“必填字段”。请参阅下面我的代码是.html文件：

<tag-input name="itemno" #itemno="ngModel" [ngModel]="genreIds" [onlyFromAutocomplete]="true" required placeholder="" class="form-control none">
    <tag-input-dropdown [autocompleteItems]="itemsAsObjects">
    </tag-input-dropdown>
</tag-input>

<div *ngIf="contentStandalonrFrm.submitted && itemno.invalid">
    <div *ngIf="itemno.errors.required" class="text-danger">{{required_field}}</div>
</div>

在.ts文件中：

listArray.forEach(item => {
    this.genreIds.push({ 'value': item.genreId, display : item.genreName });
});

当我控制台时this.genreIds，它向我显示以下内容：

{value: 36, display: "Animation"};

4

1 回答 1

1

当您使用 push 方法推送值时，不会触发 ngx-chips 组件更改检测。

角度变化检测仅检查对象身份，而不检查对象内容。因此不会检测到插入或移除

尝试这个：

const selectedValue =  listArray.map(item => {
   return { 'value': item.genreId, display : item.genreName };
});

this.genreIds = selectedValue;

参考

例子

于 2020-03-17T05:02:29.413 回答