javascript - AngularJS - 触发 Angular 应用程序重新加载数据

Question

我有一个应用程序，可以在页面加载时从后端服务获取 JSON 数据。效果很好。我现有的框架允许刷新每个组件(DIV)以通过 JavaScript 函数获取最新数据。

<div class="breakdownChart" ng-app="breakdown" ng-controller="PhoneListCtrl">
    <div ng-repeat="breakdownSummaryRow in breakdownResults.summary.rows" >
        <div class="breakdownChartRow" >
            <div class="breakdownChartValue">{{breakdownSummaryRow.positiveDuration}}</div>
        </div>
    </div>
</div>

var breakdownApp = angular.module('breakdown', []);

function PhoneListCtrl($scope, $http) {
    jsonDataUrl = "${jsonDataUrl}";
    scope = $scope;
    $scope.fetchData = function () {
        var httpRequest = $http.get('http://localhost:8080' + jsonDataUrl).success(function (data) {
            $scope.breakdownResults = data.data;
        });
    };
}

function load(extraParams) {}

我希望加载函数触发 Angular 应用程序调用 $http.get 调用并使用最新数据更新应用程序。我遇到的问题是我没有 $scope 或 $http 上下文传递给 PhoneListCtrl 函数。我在想我应该告诉应用程序刷新并调用 PhoneListCtrl 函数？

你能帮忙吗？提前致谢

Answer 1

在标有ng-controller的div内创建一个按钮标签。例如在 ng-repeat div 之后，您可以创建该按钮。

给它一个ng-click，其函数将在 Controller JavaScript 上定义。该函数可以是您的 load() 函数，它将触发数据重新加载。该函数需要位于 Controller 上，并且 html 需要位于 Controller 空间内才能工作。