Angular ngFor的变化检测

我在DOM中有2个select元素。第二个选项应根据我在第一个选择元素上的选择填充。我在这里创建了它的简化版本：

@组件({
选择器：“我的应用程序”，
模板：`
数字
颜色
{{op}}
`,
})
导出类应用程序{
名称：字符串；
构造函数（）{
}
公共值：字符串；
公开结果：任何[]；
公共颜色=[‘红色’、‘绿色’、‘蓝色’]；
公共数字=[1,2,3,4,5]；
公共教育成果（e）{
让name=e.target.options[e.target.selectedIndex].value；
console.log（名称）；
如果（名称=='numbers'）{
this.result=this.number；
console.log（this.result）；
}
其他的
this.result=this.colors；
}
}

---

它现在不工作。有什么不对的建议吗？

在视图中使用

result

而不是

results

，因为所有代码都意味着它是正确的变量：）正如@yurzui所说。

@Component({
  selector: 'my-app',
  template: `
    <div>
      <select (change)="setResults($event)">
        <option value='numbers'>Numbers</option>
        <option value='colors'>Colors</option>
      </select>
      <select>
        <option *ngFor = "let op of results" value={{op}}>{{op}}</option>
      </select>
    </div>
  `,
})
export class App {
  name:string;
  constructor() {

  }

  public value: string;
  public result: any[];
  public colors = ['red', 'green', 'blue'];
  public numbers = [1, 2, 3, 4, 5];

  public setResults(e){
    let name = e.target.options[e.target.selectedIndex].value;
    console.log(name);
    if(name === 'numbers'){
      this.result = this.numbers;
      console.log(this.result);
    }
    else
      this.result = this.colors;
  }

}