Question

我正在尝试使用使用Subscribe方法从数据库中获取的一些数据填充NgMultiSelectDropDown。要分配给下拉列表的列表已在subscription方法内填充。

a = [];
ddlList = [];
public jsonString: string = "";
public insrdList: Array < InsuredData > = [];
public insrdList1: InsuredData[];
constructor(
  http: HttpClient,
  @Inject('BASE_URL') baseUrl: string,
  private _cmsService: CMSService) {
  http.get < WeatherForecast[] > (baseUrl +
    'api/SampleData/WeatherForecasts').subscribe(result => {
    this.forecasts = result;
  }, error => console.error(error));
  this._cmsService.getAllInsuredNames().subscribe(res => {
    var i = 0;
    for (var k in res) {
      i++;
      this.ddlList.push(
        {
          "item_id": i,
          "item_text": (res)[k].insuredName
        }
      };
    }
    this.a = this.ddlList;
  }, error => console.error(error));
}

我的问题是，当我尝试将dropdown绑定到ddlList时，它不起作用。但是，当我将其绑定到a时，它就可以工作。

<ng-multiselect-dropdown [placeholder]="'custom placeholder'" [data]="a" [(ngModel)]="selectedItems" [settings]="dropdownSettings" (onSelect)="onItemSelect($event)" (onSelectAll)="onSelectAll($event)">
</ng-multiselect-dropdown>

为什么会这样？

Answer 1

MultiSelectComponent适用于ChangeDetectionStrategy.OnPush。它通过比较组件输入的引用来工作。对于ddlList，您没有更改对对象的引用（javascript中的数组是object），并且未触发OnPush更改检测器。对于a，对数组a的引用在这一部分已更改：

this.a = this.ddlList;

将列表分配给订阅方法中的下拉列表

1 个答案: