Привязка данных AngularJs + Pubnub

Я использую файл скрипта PubNub+AngularJS, предоставленный Pubnub. У меня есть контроллер, который настраивает каналы и подписывается на них. Я устанавливаю переменную scope в функции обратного вызова, и я вижу, что значение обновляется в функции scope. Проблема в том, что эта переменная scope, которая только что была обновлена, не отражается обратно на html-странице. Выходные данные консоли говорят, что сообщение pubnub вызывает метод обратного вызова, и я получаю сообщения. Но по какой-то причине переменные данные являются не отражается на html. Вот код:

TitleBarController.js 

    $scope.ops_tl = new Object();
    $scope.ops_tl.data = new Array();
    $scope.ops_tl.data.push("dummy");
    console.log("pp ", $scope.ops_tl==undefined);
    PubNub.ngSubscribe({ channel: channelsToAutoSubscribe[0] });

    $rootScope.$on(PubNub.ngMsgEv(channelsToAutoSubscribe[0]), function(event, payload) {
    // payload contains message, channel, env...
        console.log('got a message event:', payload);
        if(payload.channel == channelsToAutoSubscribe[0]) {
                // i.e. ops_tl channel
                // parse message and populate channel specific variable
                console.log($scope.ops_tl.data);
                $scope.ops_tl.data.push(payload.message);
                console.log($scope.ops_tl.data);
        }
        else {
            console.log("Received message %s from an unknown channel %s", message, channel);
        }

    });

Индекс.html 

        <div class="btn-group" ng-controller="TitleBarController">
            <button data-toggle="dropdown" class="btn dropdown-toggle">
                New users -
                <span> {{ ops_tl.data.length }} </span>
                <span class="caret"></span>
            </button>
            <ul class="dropdown-menu">
                <li ng-repeat="item in ops_tl.data"><a href="#/onboarding/{{ item.data.id }}">New user - {{ item.data.name }}</a></li>
            </ul>
        </div>
1 2
javascript angularjs ng-bind

1 ответ:

Вы столкнулись с проблемой, связанной с тем, как обрабатывается цикл событий в angular. Что вам нужно сделать, так это отложить назначение переменной scope в новый ТИК в цикле событий. Самый простой способ сделать это-использовать сервис $timeout в angular.

Попробуйте изменить эту строку: 

$scope.ops_tl.data.push(payload.message);

К этому: 

$timeout(function() {
    $scope.ops_tl.data.push(payload.message);
});
1