CODEWITHSUNDEEP
javascriptangularjs
Bogdan Tushevskyi
Bogdan Tushevskyi

Reputation: 752

Trigger button click on other element

I have "copy-button" component which using in many place of the app and allows to copy information to clipboard. It has two bindings buttonText: '@', buttonClass: '@', which allows to change text of the button and add class for styling. What i need to do is change the view of copy-button and add icons instead of default button. But i can't trigger click event on this icon.

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

Upvotes: 0

Views: 115

Answers (1)

Ghazni
Ghazni

Reputation: 836

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: '=' 
        }
    });

here onAdd can be in copyButtonController or in parent controller

use of copyButton component

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

Upvotes: 1

Related Questions