我如何使用NG-点击动态重新加载NG-重复数据？ [英] How can I use ng-click to dynamically reload ng-repeat data?

问题描述

我有一个包含 NG-重复指令的页面。在 NG-重复工作时，第一次加载页面，但我希望能够使用 NG-点击刷新在 NG-重复的内容。我曾尝试以下code，但它不工作。有什么建议？

I have a page that contains an ng-repeat directive. The ng-repeat works when the page first loads, but I want to be able to use ng-click to refresh the contents of the ng-repeat. I have tried the following code but it doesn't work. Any suggestions?

<div ng-click="loadItems('1')">Load 1st set of items</div>
<div ng-click="loadItems('2')">Load 2nd set of items</div>
...

<table>
    <tr ng-repeat="item in items">>
        // stuff
    </tr>
</table>

ItemsCtrl：

ItemsCtrl:

$scope.loadItems = function (setID) {
    $http({
        url: 'get-items/'+setID,
        method: "POST"
    })
    .success(function (data, status, headers, config) {
        $scope.items = data;
    })
    .error(function (data, status, headers, config) {
        $scope.status = status;
    });
};

我希望我的呼吁 loadItems（）将导致 NG-重复指令的重新加载从我的服务器获得新的数据。

I was hoping that my call to loadItems() would cause the ng-repeat directive to reload with the new data obtained from my server.

推荐答案

在你的回调添加广播和订阅它在你的控制器。

Add a broadcast in your callback and subscribe to it in your controller.

的这确实应该在BTW服务的

itemsService.loadItems = function (setID) {
    $http({
        url: 'get-items/'+setID,
        method: "POST"
    })
    .success(function (data, status, headers, config) {
        $scope.items = data;
        $rootScope.$broadcast('updateItems', data);
    })
    .error(function (data, status, headers, config) {
        $scope.status = status;
    });
}; 

在你的控制器：

$scope.$on("updateItems",function(d){
  $scope.items = d;
});

所以每当你 NG-点击=更新（ID）

$scope.update = function(id){
    itemsService.loadItems(id);
}

您项目将自动，因为它是订阅更新。

Your items will automatically update because it is subscribed.

这篇关于我如何使用NG-点击动态重新加载NG-重复数据？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！