Tham số của trình phát sự kiện không được xác định cho người nghe

Question

Trong thành phần Angular2, tôi sử dụng EventEmitter để phát ra một sự kiện có tham số. Trong trình lắng nghe thành phần cha, tham số này là không xác định. Đây là một số plunker:

import {Component, EventEmitter, Output} from 'angular2/core' 
@Component({ 
    template: `<ul> 
    <li *ngFor="#product of products" (click)="onClick(product)">{{product.name}}</li> 
    </ul>`, 
    selector: 'product-picker', 
    outputs: ['pick'] 
}) 
export class ProductPicker { 
    products: Array<any>; 
    pick: EventEmitter<any>; 
    constructor() { 
    this.products = [ 
     {id: 1, name: 'first product'}, 
     {id: 2, name: 'second product'}, 
     {id: 3, name: 'third product'}, 
     ]; 
    this.pick = new EventEmitter(); 
    } 
    onClick(product) { 
    this.pick.emit(product); 
    } 
} 
@Component({ 
    selector: 'my-app', 
    providers: [], 
    template: ` 
    <div> 
     <h2>Pick a product</h2> 
     <product-picker (pick)="onPick(item)"></product-picker> 
    </div> 
    <div>You picked: {{name}}</div> 
    `, 
    directives: [ProductPicker] 
}) 
export class App { 
    name: string = 'nothing'; 
    onPick(item) { 
    if (typeof item == 'undefined') { 
     console.log("item is undefined!"); 
    } else { 
     this.name = item.name; 
    } 
    } 
} 

Làm thế nào để chuyển sản phẩm đã chọn đến thành phần gốc?

Answer 1

Bạn nên $ sự kiện như thế này:

<product-picker (pick)="onPick($event)"></product-picker> 

Nó tương ứng với giá trị mà bạn cung cấp khi nói phương pháp Emit của EventEmitter liên quan.

Trong trường hợp của bạn, biến mục được cung cấp làm tham số tương ứng với không có gì.