Javascript 触发按钮单击其他元素

我有“复制按钮”组件，它在应用程序的许多地方使用，并允许将信息复制到剪贴板。它有两个绑定buttonText:'@'，buttonClass:'@'，允许更改按钮的文本并添加样式类。我需要做的是更改“复制”按钮的视图，并添加图标，而不是默认按钮。但我无法在此图标上触发单击事件

<div class="copy_code_bttn_block">
     <copy-button button-text="b" button-class="copy_bttn"></copy-button>
     <i class="icon-copy-code"></i>
</div>

copyButton.html

    <button ng-click="onAdd()">Add
       <i class="icon-copy-code" ng-if="isIcon === true"></i>
    </button>

此处onAdd可以位于copyButtonController或父控制器中

copyButton组件的使用

<copy-button on-add="ctrl.add()" is-icon="true">Test</copy-button>

测试

只需调用您用于按钮的函数。@Durga问题是“复制按钮”是组件中的另一个组件，具有“复制代码块”和“复制按钮”的功能和不同的绑定，因此我无法从按钮调用函数。我已经在复制按钮组件中拥有此功能。我需要做的是保存按钮功能，但是更改按钮的视图，比如更改按钮的图标。由于复制按钮在许多地方使用，我无法更改复制按钮的视图，只能从内部使用此复制按钮的其他组件更改。如果不清楚，我可以添加一些详细信息。您的意思是，您希望使用此按钮添加图标，并希望使用与按钮相同的图标单击功能。但是其他地方不需要此图标，并且您不会将其添加到copyButton的组件中。如果是，那么你可以根据你可以在按钮内显示图标的条件传入一个变量。更改了清晰的描述，是的，你的假设是正确的修改了答案

<copy-button on-add="ctrl.add()" is-icon="true">Test</copy-button>