如何将实时模型附加到angular.js中的控制器？

Question

我正在尝试显示几个视图/控制器，其中包含来自仪表板实时json（带有pubnub）的数据。

在angular.js常规文档中，我看到类似以下内容：

function CounterCtrl($scope) {
    $scope.data = {'counter':1};
};

但是我想要的是有一个数据源列表，然后将数据的更改通知视图并呈现它们。

因此，我可以拥有：

counter1:{'counter':1} => Rendered by view1 and view2
counter2:{'counter':5} => Rendered by view3

view4还没有数据。 几分钟后到达

counter3:{'counter':8} => Rendered by view4

然后更新counter1

counter1:{'counter':2} 

我通过每种视图类型创建一个控制器，某些2个视图可以在同一控制器中但显示不同的数据：

view1 & view3 are UpDownCtrl
view2 is LineGraphCtrl

在仪表板中，我需要更新视图，并根据数据（或缺少数据以显示空状态）更改行为。

PD：如果适合此类任务，我愿意在另一个js框架中执行此操作...

Answer 1

我也使用PubNub，并且已经在AngularJS应用程序中启动了非常基本的PubNub服务。

服务（正在进行中）：

app.factory('pubnub', function($rootScope) {
    var pubnub = {
        lastMessage: '',
        messages: [],
        callback: function(message) {
            pubnub.lastMessage = message;
            pubnub.messages.unshift(message);
            $rootScope.$broadcast('pubnubMessageReceived', message); 
        },
        getLastMessage: function() {
            return pubnub.lastMessage;
        },
        getMessages: function() {
            return pubnub.messages;
        }
    }

    PUBNUB.subscribe({
        channel    : 'my_channel',
        restore    : false, 
        callback   : pubnub.callback,
    });

    return pubnub;
});

（许多）控制器之一：

var ProjectController = function($scope, pubnub) {

    $scope.$on('pubnubMessageReceived', function(event, message) {
        console.log("pubnub message received in project controller",message);
        if(message.target == "project") {
            // The message is for me!! Do something with it
            $scope.data = message.data;
        }
    });
}

因此，我有一个服务侦听PubNub消息并通过$ rootScope广播它们，然后让任何控制器侦听这些消息很简单。 在控制器中收到消息后，修改$ scope，它将自动更新视图。