Передайте ссылку на объект DOM с помощью ng-click

У меня есть несколько элементов с тем же обратным вызовом на ng-click:

<button ng-click="doSomething()"></button>
<button ng-click="doSomething()"></button>
<button ng-click="doSomething()"></button>
<button ng-click="doSomething()"></button>

// In controller:
$scope.doSomething = function() {
  // How do I get a reference to the button that triggered the function?
};

Как я могу получить ссылку на объект, который сделал вызов doSomething? (Мне нужно удалить attr из него)

Ответы

Ответ 1

Способ angular показан в документах angular:)

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

Вот пример, который они используют:

<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>

В принципе способ angular заключается в создании объекта модели, который будет содержать то, должен ли вход быть только для чтения, а затем соответствующим образом установить этот объект модели. Красота angular заключается в том, что большую часть времени вам не нужно делать какие-либо манипуляции с dom. Вы просто angular визуализируете представление так, как ваша модель установлена ​​(пусть angular выполняет манипуляции с dom для вас и сохраняет ваш код в чистоте).

Итак, в основном в вашем случае вы хотели бы сделать что-то вроде ниже или проверить этот рабочий пример.

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

Ответ 2

Пока вы делаете следующее, технически говоря:

<button ng-click="doSomething($event)"></button>

// In controller:
$scope.doSomething = function($event) {
  //reference to the button that triggered the function:
  $event.target
};

Это, вероятно, то, что вы не хотите делать, поскольку философия AngularJS заключается в том, чтобы сосредоточиться на манипуляции с моделью и позволить AngularJS делать рендеринг (основанный на подсказках из декларативного интерфейса). Манипулирование элементами DOM и атрибутами от контроллера является большим нет-нет в мире AngularJS.

Вы можете проверить этот ответ для получения дополнительной информации: fooobar.com/info/36924/...