javascript - 如何刷新 Controller 以更改/刷新 AngularJS 中的 JSON 调用?

标签 javascript ajax json angularjs refresh

我是 AngularJS 的新手。

我的代码正在调用一个 JSON 文件并显示输出。但是,我希望调用根据特定变量(即关键字)的变化来更改 JSON 调用。

这是 HTML 部分:

<body ng-controller="AppController">

  <button type="button" class="btn btn-danger" ng-click="ChangeKW()">
    Click to Change KeyWord
  </button>


  <div ng-controller="customersController as custCont" ng-model="keyWord">
    KeyWord:{{ keyWord }} ==== iter:{{ iter }}
    <ul>
      <li ng-repeat="x in names">
        {{ x.Name + ', ' + x.Country }}
      </li>
    </ul>
  </div>

</body>

这里是 Controller 部分:

  var app = angular.module('App', []);

  app.controller('AppController', function($scope, $window) {

    $scope.keyWord = 3;
    $scope.iter = 1;

    $scope.ChangeKW = function() {
      if ( $scope.keyWord === 3 )
        $scope.keyWord = 1;
      else
        $scope.keyWord = $scope.keyWord + 1;
    }
  });

  app.controller("customersController", function($scope, $http) {

    $scope.iter = $scope.iter + 1;
    $http({
      url: 'test' + $scope.keyWord + '.txt',
      dataType: 'json',
      method: 'GET',
      data: '',
      headers: {
        "Content-Type": "application/json"
      }
    }).success(function(response) {
      $scope.names = response;
    }).error(function(error) {
      $scope.names = [{
        "Name": "Errrrrrr"
      }];
    });

  });

我希望程序根据 KeyWord 变量的值加载相应的 JSON 文件 text1.txt、text2.txt 或 text3.txt,可以通过单击红色按钮更改该值。我在 HTML 中定义了 mg-model="KeyWord",它更改了输出中 {{ KeyWord }} 的值,但它不发送刷新 JSON 调用/输出。最初加载的文件是tex3.txt(这三个文件都可以从第1条记录中区分出来)。

Plunker 可以在这里找到:Plunker .

最佳答案

你可能需要:

$scope.$watch('keyWord',function()
  {
    //$http call here 
  }
);

每次 $scope.keyWord 更改时,“$watch”都会自动调用 $http。

关于javascript - 如何刷新 Controller 以更改/刷新 AngularJS 中的 JSON 调用?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28397609/

相关文章:

javascript - 通过http传输大量json

java - 将具有字符串 json 字段的 java 对象转换为 JSON

javascript - 在JS中访问嵌套数组元素

javascript - 如何基于onclick向数据表填充数据

java - Ajax 请求到底是什么?它与 Servlet 请求不同吗?

json - 如何提高 ASP.NET MVC WEB API 的性能?

javascript - 导出调用另一个函数而不是原始函数的新函数有什么意义?

javascript - 如何在 Javascript 中使用三元运算符来确定某物是偶数还是奇数?

javascript - 排序递归函数导致数组的数组

javascript - 如何在不创建单独的jsp的情况下刷新表?