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自动建议调用服务器会在无限循环

回答

相关问题