如何在编程中更改已经渲染的组件的输入值(Angular 2)

Question

在我的Angular 2应用中，我有一个组件（MainComp），该元件包括另一个通过

 <my-comp></my-comp>

my-comp emits（在选择/单击）的值（是一个自定义下拉列表）通过

this.optionSelected.emit(currentOption == "Not described" ? null : currentOption);

mainComp接收下拉的值

Answer 1

您已经有2个绑定，因此，如果对象更改，则还应刷新结果。如果您有EventEmitter，请在构造函数中订阅：

class MainComp {
  let value;
  ...
  constructor(private myComp : MyComp) {
    myComp.optionSelected.subscribe{
      (value) => this. value = value;
    }
}

现在，每次EventEmitter发射发射时，MainComp中的值属性都会更新。

如果您想了解一些东西，请查看ngonchanges（https://angular.io/docs/ts/latest/latest/cookbook/component-communication.html）

更新：你是说STH。这样：

class MainComp {
  template: `<myComp [(value)]=value></myComp>`
  ...
}
class MyComp {
  @Input(): value;
  ...
}

这应该创建一个2条结合，因此，如果其中一个组件编辑值，则会被通知。看一下：https：//angular.io/docs/ts/latest/guide/template-syntax.html#！#ngmodel