Angular 8: проблема проверки формы ngx-chips

Question

Я использую ngx-chips в одном из моих Angular 8 проектов. Когда я был в форме редактирования (ngForm), я вижу, что tag-input имеет название жанра, который выбран. Однако я не могу отправить форму, так как в ней указано «Поле обязательно для заполнения». См. Ниже мой код .html file:

<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"};

Answer 1

Обнаружение изменений компонентов ngx-chips не запускается, когда вы используете pu sh значение методом pu sh.

Angular Обнаружение изменений проверяет только идентичность объекта, но не его содержимое. Поэтому вставки или удаления не обнаружены

Попробуйте:

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

this.genreIds = selectedValue;

Ссылка

Пример