ANgular2自動建議調用服務器會在無限循環

試圖實現與角JS自動建議ANgular2自動建議調用服務器會在無限循環

$ npm install ng2-auto-complete --save

地圖添加和包systemjs.config.js

map['ng2-auto-complete'] = 'node_modules/ng2-auto-complete/dist'; 
packages['ng2-auto-complete'] = { main: 'ng2-auto-complete.umd.js', ...]

添加的組件

@Component({ 
    selector: 'person', 
    templateUrl: 'app/person/person.component.html' 
}) 
personalData(personName: String): Observable<DepartmentModel[]>{ 
     let headers = new Headers();   
      if(personName!= undefined){ 

       headers.append('Content-Type','application/json'); 
       headers.append('Access-Control-Allow-Origin', '*'); 
      return this.http.post(AppUtils.GET__MASTER_URL //return a list of department 
      ,{personName:personName} 
      ,{headers:headers}) 
          .map(response => response.json()) 
          .catch(this.handleError); 
      } 


    }

在person.component.html中添加標籤

<input auto-complete [(ngModel)]="myData" [source]="personalData('test')" />

其調用服務在循環..瀏覽器被絞死。

用這一個：https://github.com/ng2-ui/auto-complete

來源

2017-07-17 user630209

綁定到方法等

[source]="personalData('test')"

原因變化檢測調用personalData('test')上的每一個變化檢測週期。

解決該問題的常用方法是將personalData('test')的結果分配給屬性，並將其綁定到該屬性。

ngOnInit() { 
    this.personalData('test').subscribe(val => this.pd = val); 
}

然後

source, array or string, required. data source for dropdown list

您使用的方法來填充源personalData('test')

因此，對於每一個DOM更新用服務電話將會使用

[source]="pd"

來源

2017-07-17 07:37:55

在每個按鍵上按下，我必須從服務中獲取數據。所以我最初無法加載所有值。 – user630209

您可以使用事件綁定'（keypress）=「personalData（'test'）」'調用該方法，但不要在屬性綁定中使用它。事件綁定在事件發生時執行，每次運行變更檢測時都會執行屬性綁定。 –

爲什麼沒有顯示自動提示列表？任何幫助 – user630209

按文檔製作。

來源

2017-07-17 07:40:12 Aravind

如何完成它？我需要從數據庫中獲取列表 – user630209

ANgular2自動建議調用服務器會在無限循環

回答

相關問題