Question

我从RC1更新到RC2并得到了这个神秘的信息 - “表情在检查后发生了变化”。代码很简单父组件有两个孩子“姐妹”和“兄弟”。在init之后，姐妹发出一个分配给父变量的事件，而兄弟的Input()属性被绑定到同一个变量。我认为这是使用父变量的兄弟姐妹组件之间的“经典”交流它曾经在RC1中工作，但不是RC2。我检查了CHANGELOG.md，但没有发现任何线索。我究竟做错了什么？ http://plnkr.co/edit/HMPAbImpWWeZrVjHyb6H?p=preview

import { Component, Input, Output, EventEmitter } from '@angular/core';

@Component({
      selector: 'brother',
      template:'<h2>Brother has {{present}}</h2>'
})
export class Brother{
  @Input() present: string;
}

@Component({
  selector: 'sister',
  template:'<h2>Sister has {{_present}}</h2>'
})
export class Sister{
  @Output() present: EventEmitter<string> = new EventEmitter; 
  public _present: string = 'something';
  ngOnInit(){
    this.present.emit(this._present);
  }
}

@Component({
  selector: 'my-app',
  template: `
    <div class="container">
      <h2>Parent has {{present}}</h2>
      <brother [present]="present"></brother>
      <sister (present)="present=$event"></sister>
    </div>
  `,
  directives:[Brother,Sister]
})
export class AppComponent {
  public present: string;
}

Answer 1

是的，它已经改变了一点。具体地

fix（facade）：默认情况下将EventEmitter更改为同步（＃8761）

https://github.com/angular/angular/commit/e5904f4

因此，如果您更改代码：

@Output() present: EventEmitter<string> = new EventEmitter;

为：

@Output() present: EventEmitter<string> = new EventEmitter(true);

然后它应该工作，你会得到相同的行为。

另见https://github.com/angular/angular/blob/master/modules/%40angular/facade/src/async.ts#L152

http://www.bennadel.com/blog/3071-synchronous-vs-asynchronous-eventemitters-in-angular-2-beta-14.htm

Answer 2

Angular从上到下处理模板，先检查兄弟，然后检查姐姐。姐姐解雇了同步事件并且在它（兄弟）被检查之后改变了兄弟领域。 Angular在调试模式下检测到这种错误，在生产模式下，此更改将在下一个检测器通过之前保持未检测到（模板不会更新）。您可以在应用模板中更改组件的顺序，错误将消失：

  <sister (present)="present=$event"></sister>
  <brother [present]="present"></brother>

Angular2 RC2表达式在检查后发生了变化。

2 个答案: