角度变化检测ngFor

时间:2021-05-18 08:07:56

标签: arrays angular data-binding angular8 ngfor

我的选项卡视图中有一个名为 peoples 的数组。我需要根据更改函数更改数组项。虽然更改功能成功运行并在控制台上每次更改后以不同的方式打印数组,但视图本身并没有从 ngInit() 分配的初始值改变;

ngOnInit(){
  this.someservice.loadallpeople().subscribe(data=>{
    this.peoples=data.Data;
  });
}

loadpeople(category:any){
  this.someservice.getpeoplebycat(category).subscribe(data=>{
    this.peoples=data.Data;
  });
}
<select [(ngModel)]="category.name"
        (ngModelChange)="loadpeople(category.name)">  
  <option *ngFor="let cat of category">{{category.name}} </option>
</select>  
    
<div *ngFor="let people of peoples">
  <span>{{people.name}}</span>
</div>

我使用了一些方法,但它们似乎都不起作用。任何小的帮助将不胜感激。

1 个答案:

答案 0 :(得分:0)

您所展示的内容有些不清楚。

首先在 [(ngModel)]="category.name" 上使用 (ngModelChange)="loadpeople(category.name)"category.name,但接下来迭代 category 并得到 cat.name,因此不可能有 {{ 1}} 元素,如果它是一个数组。

其次,我将根据您显示的内容使用 category.name 而不是 (change) + [ngModel],因为如前所述,(ngModelChange) 不能返回任何内容。

所以有了所有这些更新,我会做这样的事情

category.name
ngOnInit(){
  this.someservice.loadallpeople().subscribe(data=>{
    this.peoples=data.Data;
  });
}

loadpeople(event){
  this.someservice.getpeoplebycat(event.target.value).subscribe(data=>{
    this.peoples=data.Data;
  });
}