单击模式内部的按钮（角度7）后，更改父组件中按钮的名称

Question

我正在Angular 7项目中工作，我想在子组件中单击按钮后，从父组件中更改按钮的名称。

当前，当我从父级单击“按钮A​​”时，模式将打开。之后，当我从模态中单击“按钮B”时，我希望父级的“按钮A”将其名称更改为“ C”。我尝试使用localStorage，但没有用。您对此有任何想法吗？

提前谢谢！

Answer 1

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

@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）=“您的函数即可更改按钮文本”，如下所示：

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

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

changeButtonText($event:any){
this.buttonTextVariable = 'C'
}