Question

我有一个Angular2项目（IntelliJ IDEA）我根据this示例使用双向绑定：

child.component.ts：

  counterValue = 0;
  @Output() counterChange = new EventEmitter();

  @Input()
  get counter() {
    return this.counterValue;
  }

  set counter(val) {
    this.counterValue = val;
    this.counterChange.emit(this.counterValue);
  }

  decrement() {
    this.counter--;
  }

  increment() {
    this.counter++;
  }

child.component.html：

<button (click)="decrement()">-</button>
<span>{{counter}}</span>
<button (click)="increment()">+</button>

parent.component.html：

<child-component [(counter)]="co"></child-component>
co: {{co}}

parent.component.ts：

co = 4;

代码按预期工作 - 除非我更改一些变量名称（两种方式：使用重构以及手动查找所有引用）。

我可以更改counterValue的名称（甚至可以通过整个代码更改变量类型），但只要重构counterChange（2个出现，据我所知）或{{ 1}}（child.component.ts中为4，child.component.html中为2，parent.html中为1）与父项的输出绑定停止工作。然而，子组件始终按预期工作;只是父组件的counter(...)变量不再更新。

我甚至重新启动IntelliJ＆amp; npm，清除IntelliJ和浏览器的缓存：没有帮助。

通过将名称更改回示例中的名称，输出绑定将再次起作用。

我现在已经没有想法，并且有一种忽视某些根本性的可怕感觉......

Answer 1

您必须记住的一个条件是@output变量名始终是输入的一个+“更改”;

实施例

@Input() newName: number;
@Output() newNameChange = new EventEmitter();

IntelliJ IDEA＆amp;打字稿：奇怪的行为重命名EventEmitter

1 个答案: