使用EventEmtter Angular2返回值

Question

我有一个eventemitter，在父组件中发出事件，我希望它从父组件执行一系列说明，结果将其返回给呼叫者，this.filteredlist，我希望它包含父组件返回的列表，但是当它返回时，FilteredList是未定义的

这是de chid组件" autocomplete.component.ts："//当this.changefilter.emit中返回时，this.filteredlist不确定：

export class AutocompleteComponent implements OnInit {
    ...
    public filteredList = [];
    @Output() changeFilter = new EventEmitter<any>();

    filter(){
     //This is where I want the filteredList to contain the list returned by the other component:
     this.filteredList =this.changeFilter.emit({query:this.query}); 
     if (filteredList){
        console.log(filteredList); 
      }
    }

模板：

    <div class="container">
    <div class="input-field col s12">
      <input id="clienteAut" type="text" class="form-control bs-autocomplete" style="width:300px;" [(ngModel)]="query" (keyup)="filter()" on-click="filterAll()">
      <label for="clienteAut"></label>
    </div>
    <div class="divLista" *ngIf="filteredList.length > 0" style="">
      <div class="divFila" *ngFor="let item of filteredList">
        <ul >
          <li>
            <a (click)="select(item)">{{item.CodigoCliente}} - {{item.Nombre}}</a>
          </li>
        </ul>
      </div>
    </div>
    </div>

这是父组件" busquedacompiadoras.component.ts"：

//函数" onChangeFilterClientes"返回带有数据的列表，但是当它返回到儿童组件的eventEmitter时，this.filteredlist是未定义的//有什么想法？

export class BusquedaCopiadorasComponent {  
clientes: Array<any> //= [];
ngOnInit() {
    this._comunService.getMarcas()
        .subscribe((clientesData) => {
            this.clientes = clientesData as clienteModel[];
            //this.rellenarMarcas(marcasData);
        });
}    
onChangeFilterClientes(obj:any):any[]{        
     this.clientesFilter = this.clientes.filter(c => c.Nombre.toString().toLowerCase().indexOf(obj.query)>-1);       
     return this.clientesFilter; 
}

Answer 1

尝试以下内容：

导出类AutoCompleteComponent ininit { ...

@Input() public filteredList = [];
@Output() changeFilter = new EventEmitter<any>();

filter(){
 //This is where I want the filteredList to contain the list returned by the other component:
 this.changeFilter.emit({query:this.query}); 
}

和在BusquedacopiaDorasComponent模板中通过以下过滤列表：

 [filteredList]="clientesFilter"