Question

我正在尝试使用过滤器更改变量。看起来像这样。

<select ng-init="inputStatus='ALL'" ng-model="inputStatus">
  <option value="ALL">ALL</option>
  <option value="NEW">NEW</option>
  <option value="RENEW">RENEW</option>
  <option value="FINISHED">FINISHED</option>
  <option value="FAILED">FAILED</option>
</select>

正如您所看到的，每次选择新选项时，变量都会发生变化。

这是我的$ watch功能。

var testValue = '';

$scope.$watch('inputStatus', function(val) {

  if (val) {
   testValue = val;
  }
}, true);

console.log(testValue);

我需要在这里使用testValue来过滤数据。

$http.get("/api/v1/websites/?limit=" + $scope.main.limit + "&offset=" + $scope.main.offset + "&status=" + testValue)
then(function successCallback(result) {
    $scope.websites = result.data.results;
});

我该怎么做？

Answer 1

使用ng-change指令代替$watch：

<select ng-init="inputStatus='ALL'" ng-model="inputStatus"
        ng-change="updateWebsite(inputStatus)">
  <option value="ALL">ALL</option>
  <option value="NEW">NEW</option>
  <option value="RENEW">RENEW</option>
  <option value="FINISHED">FINISHED</option>
  <option value="FAILED">FAILED</option>
</select>

在控制器中：

$scope.updateWebsites = updateWebsites;

function updateWebsites(status) {
    var url = "/api/v1/websites";
    var params = { limit: $scope.main.limit,
                   offset: $scope.main.offset,
                   status: status };

    var config = { params: params };

    $http.get(url, config)
      .then(function successHandler(response) {
         $scope.websites = response.data.results;
    }).catch(function errorHandler(response) {
         console.log("ERROR", response.status)
    });
}

AngularJS如何使用带$ http的$ watch变量？

1 个答案: