angular2 在子组件中更改@input 值然后在父组件中更改此值不起作用

父组件类

export class Parent {
   show: boolean = false;
   constructor() { }
   showChild() {
      this.show = true;
   }
}

父组件模板

<child [isShow]="show"></child>

子组件类

export class Child {
   @Input isShow: boolean = false;
   constructor() { }
   onClick() {
      this.isShow = false;
    }
}

在子组件中触发 onClick() 后，showChild() 无法显示子组件。

为什么？

最佳答案

因为您使用的是方括号，所以该值仅从父级传递给子级。

为了让值双向传递，您需要使用双向数据绑定(bind)。

这意味着您的 isShow 属性应该是这样的:

@Input()  isShow: boolean;
@Output() isShowChange = new EventEmitter<boolean>();

模板应该是

<child [(isShow)]="show"></child>

或

<child [isShow]="show" (isShowChange)="show = $event"></child>

看一下双向数据绑定(bind)教程页面:

关于angular2 在子组件中更改@input 值然后在父组件中更改此值不起作用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/43373122/