Pass a reference to DOM object with ng-click

Question

I have multiple elements with the same callback on ng-click    lt button ng-click  doSomething    gt  lt  button gt   lt button ng-click  doSomething    gt  lt  button gt   lt button ng-click  doSomething    gt  lt  button gt   lt button ng-click  doSomething    gt  lt  button gt       In controller   scope doSomething   function          How do I get a reference to the button that triggered the function       How can I get the reference to the object which made the call to doSomething   I need to remove an attr from it

User · Accepted Answer

The angular way is shown in the angular docs :)

https://docs.angularjs.org/api/ng/directive/ngReadonly

Here is the example they use:

<body>
    Check me to make text readonly: <input type="checkbox" ng-model="checked"><br/>
    <input type="text" ng-readonly="checked" value="I'm Angular"/>
</body>

Basically the angular way is to create a model object that will hold whether or not the input should be readonly and then set that model object accordingly. The beauty of angular is that most of the time you don't need to do any dom manipulation. You just have angular render the view they way your model is set (let angular do the dom manipulation for you and keep your code clean).

So basically in your case you would want to do something like below or check out this working example.

<button ng-click="isInput1ReadOnly = !isInput1ReadOnly">Click Me</button>
<input type="text" ng-readonly="isInput1ReadOnly" value="Angular Rules!"/>

User · Answer

While you do the following  technically speaking    lt button ng-click  doSomething  event   gt  lt  button gt       In controller   scope doSomething   function  event        reference to the button that triggered the function     event target      This is probably something you don t want to do as AngularJS philosophy is to focus on model manipulation and let AngularJS do the rendering  based on hints from the declarative UI   Manipulating DOM elements and attributes from a controller is a big no-no in AngularJS world   You might check this answer for more info  https   stackoverflow com a 12431211 1418796

[angularjs] Pass a reference to DOM object with ng-click

Examples related to angularjs

Examples related to angularjs-ng-click