Проблема AngularJS с ng-click и 2 выражениями внутри, только один выстрел - PullRequest
Новая
       17

Проблема AngularJS с ng-click и 2 выражениями внутри, только один выстрел

0 голосов
/ 07 июня 2018

У меня проблема, при щелчке мышью у меня есть 2 выражения, и срабатывает только одно.

Если я использую только одно выражение за раз, они оба работают, но вместе они не работают.

Один - это функция, а другой - простой: button = !button;который я использую, чтобы вызвать состояние кнопки.

Все это внутри ng-repeat, поэтому я получу несколько кнопок, и каждая из них должна иметь свое собственное состояние.

Что яувидел, что если вместо выполнения: button = !button, который будет работать только в одиночку, но не вместе с функцией (поэтому ng-click= "func(); button = !button" не будет запускать второе выражение).

, но если я объявляю простой bool в контроллере, как это: 

button: boolean;
this.button = false;

, затем используйте: ng-click= "func(); $scope.button = !$scope.button"

Это будет запускать оба выражения правильно, но проблема здесь в том, что я использую ng-repeatТаким образом, если при нажатии этого решения сгенерируется 10 кнопок, все 10 кнопок сработают, потому что они используют один и тот же bool.

. Поэтому, чтобы избежать добавления нового свойства в мой списокобъекты, которые я зацикливаю, только для состояния кнопки, есть ли более простое решение?

Я даже не понимаю, почему использование объявленного boolean в контроллере будет работать, а использование простого: var = !var в представлении не будет.

Я попытался использовать вместофиктивная функция, с возвратом только console.log, и она работает, поэтому она, вероятно, также имеет отношение к моей функции, но опять же, почему она будет работать с объявленным bool, а не с прямым выражением в представлении?

функция немного длинная и вызывает внутри нее другие функции, поэтому для моего вопроса я не думаю, что уместно публиковать ее, и создание скрипки также будет сложным, так как функция берет данные непосредственно изAPI.

Но важно то, что функция работает правильно и используется в нескольких местах в проекте.

Спасибо

1 Ответ

0 голосов
/ 07 июня 2018

Вы можете попробовать как приведенный ниже код, который позволит вам делать то, что вы ищете, также, пожалуйста, проверьте этот плункер для вашего примера сценария.

Шаблон: 

<div ng-repeat="btn in buttonList">
  <button type="button" value="btn.value" ng-click="func();btn.button=!btn.button" ng-disabled="btn.button">{{btn.name}}</button>
</div>

Контроллер: 

$scope.buttonList = [{
    name: 'World1',
    value: 1
  }, {
    name: 'World2',
    value: 2
  }, {
    name: 'World3',
    value: 3
  }, {
    name: 'World4',
    value: 4
  }, {
    name: 'World5',
    value: 5
  }, {
    name: 'World6',
    value: 6
  }, {
    name: 'World7',
    value: 7
  }, {
    name: 'World8',
    value: 8
  }];
...