0

我正在开发一个 Angular 7 项目,我想在单击子组件中的按钮后更改父组件中按钮的名称,这是一个模态。

目前,当我从父级单击“按钮 A”时,模式会打开。之后,当我从模式中单击“按钮 B”时,我希望父级中的“按钮 A”将其名称更改为“C”。我曾尝试使用 localStorage,但它没有用。你对如何做到这一点有任何想法吗?

先感谢您!

4

1 回答 1

0

从子组件到父组件的通信方式是通过事件发射器,首先您在子组件中定义事件输出,如下所示:

@Output() clickedButton = new EventEmitter<Observable<any>>();

接下来当点击按钮时,实现该按钮操作的方法应该像这样发出事件

this.clickedButton.emit(/* here goes any data you wanna pass to the parent component if its the case otherwise can be empty*/);

接下来在父组件模板上添加 (clickedButton)="your function to change the button text" 像这样:

<child-component (clickedButton)="changeButtonText($event)"></child-component>

并且在您的父组件中,您可以根据需要将按钮文本更改为另一个文本,只要按钮文本是变量,或者您可以访问按钮组件并更改文本,但这听起来比您需要的更复杂

changeButtonText($event:any){
this.buttonTextVariable = 'C'
}
于 2019-02-20T11:00:19.443 回答