Làm cách nào để sử dụng ng-click để tự động tải lại dữ liệu ng-lặp lại?

Question

Tôi có một trang có chứa chỉ thị ng-repeat. ng-repeat hoạt động khi trang tải lần đầu tiên, nhưng tôi muốn có thể sử dụng ng-click để làm mới nội dung của ng-repeat. Tôi đã thử đoạn mã sau nhưng nó không hoạt động. Bất kỳ đề xuất?

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

$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; 
    }); 
}; 

Tôi đã hy vọng rằng cuộc gọi của tôi để loadItems() sẽ gây ra các chỉ thị ng-repeat để tải lại với các dữ liệu mới thu được từ máy chủ của tôi.

Answer 1

Thêm chương trình phát sóng trong cuộc gọi lại của bạn và đăng ký nó trong bộ điều khiển của bạn.

Điều này thực sự phải ở trong một dịch vụ 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; 
    }); 
}; 

Trong điều khiển của bạn:

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

Vì vậy, bất cứ khi nào bạn ng-click="update(id)"

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

bạn items sẽ tự động cập nhật được gây ra nó được đăng ký.