Angular2：視圖未更新

Question

這是另一個“視圖不變”的問題

選擇名稱后，我需要更新一個組件。 但是，我不知道為什么，在更改模型之前，我必須選擇兩倍的名稱。 就像我第一次選擇模型不更新一樣。

將Angular 2 4.0.0與materializeCSS一起使用（來自materialize的自動完成功能）

例

因此，我希望選擇后直接顯示該按鈕。

這部分的HTML模板：

<form>
            <i class="material-icons prefix">search</i>
            <input id="search" type="text" name="autoComplete" materialize="autocomplete" [materializeParams]="[autocompleteInit]">
        </form>
        <div *ngIf="CVSelected.getCV()">
            <button type="button" [routerLink]="['/dashboard/cv']" class="waves-effect waves-light btn">Passer à l'édition</button>
        </div>

AutocompleteInit：

autocompleteInit: any = {
    data:  {Some_data_here},
    onAutocomplete: (str: string) => {
        this.dataService.GetFromString(str).subscribe(value => {
            console.log(value);
            this.CVSelected.setCV(value[0]); // This makes the button appears on my template with a get
        });
        this.changement.detectChanges(); // Tried this and other functions that does the same but doesn't work
    },
};

有人遇到過這個問題嗎？ 如果是，一些解決方案？

先感謝您

Answer 1

在這種情況下，最可能的原因是執行代碼在角度區域之外。 為了解決這個問題，我建議您在角度區域內運行代碼，例如：

constructor(private zone: NgZone) { }

autocompleteInit: any = {
  data:  {},
  onAutocomplete: (str: string) => {
     zone.run(() => {
        this.dataService.GetFromString(str).subscribe(value => {
          console.log(value);
          this.CVSelected.setCV(value[0]); // This makes the button appears on my template with a get
        });
     });
  },