Выдать значение на кнопку поиска в зависимости от состояния флажка, AngualrJS

Question

Мое приложение имеет кнопку поиска , которая обращается к внутреннему API с запросом GET .Затем мы выбираем данные, которые защищены в некоторых случаях.У меня есть флажок , который по умолчанию установлен на true для имитации поведения Back-End.

Если этот флажок снят, то мы добавим параметрна наш запрос GET Request protection: false. Это говорит Back-End о предоставлении нам доступа к незащищенным данным.

Мой вопрос такой. Как следить за состоянием флажка в Angular Controller, и это изменение выводится на кнопку поиска?

Я понимаю, что для этого нужно использовать $scope.watch, но AngularJS нене мой сильный костюм, поэтому, пожалуйста, помогите.

Параметр защиты передается как Действие от Redux , вплоть до RxJS Epic , Редуктор , а затем вводится в endpoint.js и service.js файлы, которые обрабатывают ваши запросы.

Это сделано и работает.Моя большая проблема заключается в том, как обрабатывать угловые детали. Ниже вы найдете код для файлов HTML и файлов контроллера.

INDEX.HTML

<button class="btn btn-default btn-sm" ng-click="getData(something, protection)"
     ng-disabled="Ctrl.loading">
     Run Search
</button>
<span>Protection
     <input type="checkbox" ng-model="Ctrl.Protection">
</span>

Controller.js

  $scope.getData = (something, protection) => {
    ctrl.getSomecData(protection, protection);
    ctrl.saveRecentSearch(something);
  };

Итак, один последний шаг.Я хочу иметь возможность установить и снять флажок, и это изменение должно быть отправлено на кнопку поиска, а затем ввести этот параметр в запрос GET.

Пожалуйста, помогите мне сделать это в Angularjs.Я не работал с этим до этой работы, и это действительно расстраивает.Спасибо за ваше время.

Answer 1

Вам просто нужно использовать директиву ngChange angular js на элементе checkbox.метод, связанный с атрибутом ng-change, будет вызываться всякий раз, когда флажок установлен или не установлен.дальнейшее использование $ watch не рекомендуется, поскольку оно влияет на производительность страницы.

HTML:

<input type="checkbox" ng-model="Ctrl.Protection" ng-change="change()">

В вашем контроллере:

$scope.change = function() {
    if(this.Protection){
      //whatever you wish to do here
      $scope.getData($scope.something, this.protection);
    }
  };