Question

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

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

Answer 1

copyButton.html

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

copyButton.component.js

angular
    .module('app')
    .component('copyButton', { 
        templateUrl: 'copyButton.html', 
        controller: copyButtonController, 
        bindings: { 
            onAdd: '&',
            isIcon: '=' 
        }
    });

这里onAdd可以在copyButtonController中或在父控制器中

使用copyButton组件

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

触发按钮单击其他元素

1 个答案: