angularjs – 为什么我要为一个项目多次调用？

发布时间：2020-12-17 07:13:53 所属栏目：安全来源：网络整理

导读：我正在尝试调用服务器以根据在下拉列表中选择的特定ID获取项目列表. HTML： tr ng-repeat="parent in model.waivers" tdselect ng-model="parent.ID" ng-options="object.Key as object.Value for object in model.myObject"/select/td tdselect ng-model="p

我正在尝试调用服务器以根据在下拉列表中选择的特定ID获取项目列表.

HTML：

<tr ng-repeat="parent in model.waivers">
    <td><select ng-model="parent.ID" ng-options="object.Key as object.Value for object in model.myObject"></select></td>
    <td><select ng-model="parent.ServiceNameID" ng-options="expectedResult.Key as expectedResult.Value for expectedResult in model.output(object.ID)"></select></td>
</tr>

控制器：

$scope.model.output = function(id) {
        console.log(id);
    }

模型：

var Model = function() {
    this.parent = [];
};

我只是在这里登录以查看结果.我真正打算做的是根据该ID获取一个列表.

如果有3个表行,那么输出的是：

代替：

1
2
3

这是我所期望的,因为每行只有一个id.

有关导致此行为的原因有何建议？

更新

所以@Fieldset告诉我,问题是由父方法中每个项目的角度调用方法引起的.

有关如何执行此操作的任何建议,每个项目只调用一次方法吗？

解决方法

你的代码在ng-repeat中,所以model.output(object.ID)将被调用多次,因为model.waivers中有元素.

您无法像这样向服务器发出请求,因为您的HTTP请求将是异步的并返回一个承诺,您不能在视图中使用承诺.您必须在控制器($scope)中加载数据,然后您的视图才能通过$scope访问您的数据

您必须先申请数据：

调节器

function($scope,$http) {

  $scope.data = [];

  //This is asynchronous
  $http.get('my/path/to/my.data').success(function(data) {
    $scope.data = data;
  });

}

编辑：

angular.module('myApp',[]).controller('myCtrl',function($scope,$http,$q) {

  //One request per id
  var ids = [4,52,65,12,78];
  var promises = [];

  ids.forEach(function(id) {
    promises.push($http.get('my/path/to/my.data?id='+id));
  });



  //Fill $scope.data when all requests are done
  $scope.data = [];

  $q.all(promises).then(function(data){

    $scope.data = data;

    /**
     * You get something wich looks like
     * 
     * Assuming that your webservice returns a response like {id: 4,name: 'Something'}
     * 
     * $scope.data = [
     *  {id: 4,name: 'Something'},*  {id: 52,name: 'Something else'},*  {id: 65,name: 'foo'},*  {id: 12,name: 'bar'},*  {id: 78,name: 'foobar'}
     * ];
     * 
     * So you can loop over $scope.data in your view
     * 
     */

  });

});

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!