Question

我的应用程序具有一个搜索按钮，该按钮会通过GET请求点击内部API 。然后，在某些情况下，我们获取受保护的数据。我有一个复选框，默认情况下它设置为 true 以模拟后端行为。

如果未选中该框，则我们向查询GET请求中添加参数 protection: false.，这将告诉后端使我们能够访问不受保护的数据。

我的问题是这个。 如何在Angular Controller中监视复选框状态，并将此更改发送到搜索按钮？

我知道我需要为此使用$scope.watch，但是AngularJS不是我的强项，所以请帮忙。

保护参数作为动作从Redux 传递到 RxJS Epic ，再传递到 Reducer ，然后注入到{{ 1}}和endpoint.js文件来处理请求。

这已经完成并且可以正常工作。我的大问题是如何处理角度部分。 下面将找到HTML和Controller文件的代码。

INDEX.HTML

service.js

Controller.js

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

那么，最后一步。我希望能够选中和取消选中该框，并且应该将更改发送到搜索按钮，然后将该参数插入GET Request。

请帮助我在Angularjs中做到这一点。在这份工作之前，我还没有使用过它，这确实令人沮丧。感谢您的宝贵时间。

Answer 1

您只需要在复选框元素上使用angular js的ngChange指令。每当选中或取消选中复选框时，都会调用与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);
    }
  };

根据复选框状态AngualrJS在搜索按钮上发射值

1 个答案: