Question

假设我有一个看起来像这样的Kitchen类：

@Component({
    template: `
        <kitchen [(kitchenLunch)]=lunch></kitchen>  
    `
})
export class House {

    private lunch: Lunch;

}

众议院组成部分：

包含子组件Kitchen
房子有一个包含某种状态的dataModel。
房子在dataModel
当房屋或厨房更改dataModel时，更改应显示在两个位置。

我的问题是关于厨房中@Output的语法。这是我目前正在使用的：

@Component({
    selector: 'kitchen',
    template: '...'
})
export class Kitchen {

    @Input  
    private kitchenLunch: Lunch;

    @Output 
    private kitchenLunchChange: EventEmitter<any> = new EventEmitter();

}

这目前正如我所料。每当我更新Kitchen组件中的kitchenLunch时，我都会执行以下操作：

this.kitchenLunch = **Something**
this.kitchenDataModelChange.next(this.kitchenDataModel);

然而，这似乎有点多余。我真正想做的是缩短Kitchen类做这样的事情：

@Component({
    selector: 'kitchen',
    template: '...'
})
export class Kitchen {

    @Input  
    @Output 
    private kitchenLunch: Lunch;

}

然后当我更新kitchenLunch时，我想这样做：

this.kitchenLunch = **Something**

问题：

是否可以将私人会员作为输入＆amp;输出
你能拥有一个不是EventEmitter的@Output吗？
我可以/应该在这里使用一些短手吗？
看起来@Output的名称必须与输入加Change相同。在这种情况下kitchenLunch + Change。我通过反复试验弄明白了。这记录在哪里？

Answer 1

1）不知道，但我猜它有效。应该很容易找到。

2）没有

3）没有

4）https://angular.io/docs/ts/latest/guide/template-syntax.html

[（ngModel）]是更一般模式的具体示例   Angular＆＃34; de-sugars＆＃34;将[（x）]语法转换为x输入属性   属性绑定和事件绑定的xChange输出属性。   Angular构造了事件属性绑定的模板语句   将= $ event附加到模板表达式的文字字符串。

[（X）] =＆＃34; E＆＃34; ＆LT; ==＆GT; [X] =＆＃34; E＆＃34; （的xChange）=＆＃34; E = $事件＆＃34;

我们可以编写一个我们自己的双向绑定指令来利用它   行为。

Answer 2

您不必使用Ouput EventEmitter进行双向绑定。

但是，建议将单向绑定与EventEmitter一起使用，因为它可能会为您提供更好的性能。简而言之，它减少了 Angular 2 应该执行的变化检测量。

此处有更多详情http://blog.mgechev.com/2016/01/23/angular2-viewchildren-contentchildren-difference-viewproviders/

Angular2：在进行双向绑定时，是否需要显式使用EventEmitter？

2 个答案: