Javascript 在Angular-chart.js上动态设置数据

老实说，我对angularjs有点陌生，所以这可能是我对角度图而不是角度图基本理解的问题

我有两个控制器（pieetemsctrl和PieCtrl），我希望使用工厂服务（称为pieetems）在它们之间进行通信

一方面，pieItems按照PieItemsCtrl中的设计工作

即：

每当pieItems服务中发生变化（即添加了另一个元素），HTML就会通过中继器自动更新：

<div ng-repeat="(key, val) in slices">

它似乎在加载/初始化PieCtrl时设置这些数据值，就是这样。每当pieItems数据更改时，这些范围值都不会更新

下面是两个控制器和工厂对象的来源。我还做了一个不可行的，以防有帮助

PieItemsCtrl：

app.controller('PieItemsCtrl', function($scope, $http, $rootScope, pieItems) {

        $scope.slices =  pieItems.list();
        $scope.buttonClick = function($event) {
            pieItems.add(
                {
                    Name: $scope.newSliceName,
                    Percent: $scope.newSlicePercent,
                    Color: $scope.newSliceColor
                }
            )
        }

        $scope.deleteClick = function(item, $event) {
            pieItems.delete(item);
        }
    } 
)

PieCtrl：

app.controller("PieCtrl", function ($scope, $timeout, pieItems) {
    $scope.labels = pieItems.labelsItems();
    $scope.data = pieItems.data();
});

项目：

app.factory('pieItems', function() {
    var items = [];

    var itemsService = {};

    itemsService.add = function(item) {
        items.push(item);
    };
    itemsService.delete = function(item) {

        for (i = 0; i < items.length; i++) {
            if (items[i].Name === item.Name) {
                items.splice(i, 1);
            }
        }
    };
    itemsService.list = function() {
        return items;
    };

    itemsService.labelsItems = function() {

        var a = ['x', 'y'];
        for (i = 0; i < items.length; i++) {
            a.push(items[i].Name);
        }
        return a;
    };
    itemsService.data = function() {

        var a = [50,50];
        for (i = 0; i < items.length; i++) {
            a.push(items[i].Percent);
        }
        return a;
    };

    return itemsService;
});

app.factory（'pieems'，function（）{
var项目=[]；
var itemsService={}；
itemsService.add=函数（项目）{
项目。推送（项目）；
};
itemsService.delete=函数（项目）{
对于（i=0；i

当出厂值发生变化时，控制器不会注意到。若要在角度摘要循环中包含项目数组，请告知该数组的角度

如果不想公开数组，请创建一个getter：

itemsService.get = function() { return items; }

然后，可以在控制器的$watch表达式中包含该getter：

$scope.$watch(getItems, watcherFunction, true);
function getItems() {
    return pieItems.get();
}

getItems函数在digest cycle上被调用，如果值发生了更改，并将newData作为参数，则会激发watcherFunction

true

作为第三个参数创建深度监视

function watcherFunction(newData) {
     console.log(newData);
     // do sth if array was changed
}

对于更复杂的对象，可以使用$watchCollection

$scope.$watch(getItems, watcherFunction, true);
function getItems() {
    return pieItems.get();
}

function watcherFunction(newData) {
     console.log(newData);
     // do sth if array was changed
}