如何在其他组件中将值从子节点传递给父节点?

时间:2017-08-04 07:56:45

标签: angular

在用户预览组件中,我有:

   <z-card-container bodyType="block-body-transparent">
      <div *ngIf="!view360flag">
        <z-card-search-top title="Tražilica" collapsed="true"  (search)="searchCustomerAccount($event)" [disableButton]="!selectedfilter"
          (clearClicked)="clearSearch()">
          <div class="row">
            <z-advanced-search class="col-md-12" [search]="search"  (notifyParent)="isSelectedFilter($event)" ></z-advanced-search>
          </div>
        </z-card-search-top>
    </z-card-container>

我高级搜索我添加了这个:this.notifyParent.emit(true);

我想在z-search-top中听取高级搜索中的值,但这不起作用:

  isSelectedFilter(e){
    console.log('is selected',e);
  }

1 个答案:

答案 0 :(得分:0)

Everythin看起来不错,但我为你写了一个简单的EventEmitter样本

https://plnkr.co/edit/qcnazG63fn1nWxActetn?p=preview

@Component({
  selector: 'my-app-inner',
  template: `
    <div>
      <button (click)="notifyParent.emit('search value')">search</button>
    </div>
  `,
})
class AppInner {
  @Output() notifyParent: EventEmitter<string> = new EventEmitter();
  constructor() {
  }
}

@Component({
  selector: 'my-app',
  template: `
    <div>
      <h2>search is used: {{searchedTimes}} times and emmiterd value is: {{emiterdValue}}</h2>
      <my-app-inner (notifyParent)="incerementSearchTimes($event)"></my-app-inner>
    </div>
  `,
})
export class App {
  searchedTimes: number;
  emiterdValue: string;
  constructor() {
    this.searchedTimes = 0
  }

  incerementSearchTimes(emiterdValue){
    this.emiterdValue = emiterdValue
    debugger;
    this.searchedTimes++;
  }
}