2014-02-13 3 views
3

Я использую angularJS с коннектором узла, который отправляет данные с помощью socketio. Затем я пытаюсь показать данные с помощью ng-repeat. Если я инициализирую данные внутри контроллера, то ng-repeat работает нормально, но если я добавлю данные, когда он будет получен с сервера, на экране при использовании ng-repeat ничего не будет отображаться на экране.ng-repeat массив объектов nodejs

Вот фрагмент кода, я использую: (trans.html)

<div id='trans' ng-app='MyApp'> 
    <h1>Transactions</h1> 
    <div class="pure-g-r" ng-controller='TransController'> 
     <div class="pure-u-1-2" ng-repeat="trans in transactions"> 
      <h1>{{ trans.name }}</h1> 
      <p>{{ trans.description}}</p> 
      <p>{{ trans.date }}</p> 
      <p>{{ trans.category }}</p> 
     </div> 
    </div> 

</div> 

<script src="/js/loadAngular.js"></script> 

(controller.js)

function TransController($scope, socket) { 
    $scope.transactions = []; 
    $scope.currentMonth = "March"; 
    $scope.categories = []; 

    init(); 

    function init() { 
     console.log("emitting init functs"); 
     socket.emit('data', {request: 'transactions', month: $scope.currentMonth}); 
     socket.emit('getCategories', {}); 
    }; 

    socket.on('dataResponse', function (data) { 
     console.log(data); 
     if(data.response === 'transactions'){ 
      $scope.transactions = []; 
      var tran = data.data; 
      for(var i = 0; i < tran.length; i++){ 
       $scope.transactions.push(tran[i]); 
       console.log(tran[i]); 
      }; 
     } 
     console.log($scope.transactions); 
     console.log("CURRENT MONTH " + $scope.currentMonth); 
    }); 

(server.js)

var myTransactions = { 
     January : [{ 
      name: "Tesco shopping", 
      date: "January", 
      description: "This is my description, I went to the shop and bought loads of food.", 
      category: "Food" 
    }], 
     February : [], 
     March : [{ 
      name: "Booze shopping", 
      date: "March", 
      description: "This is my description, I went to the shop and bought loads of food.", 
      category: "Food" 
    },{ 
      name: "Tesco shopping", 
      date: "March", 
      description: "This is my description, I went to the shop and bought loads of food.", 
      category: "Food" 
    }], 
    ... 
    }; 

    mudev.addCustomEvent('data', function(socket,data){ 
     var request = data.request; 
     var month = data.month; 
     console.log("Data Request: request:",request, " month:",month); 
     if(month==null){ 
      socket.emit('dataResponse', { 
       response: 'transactions', 
       data: myTransactions 
      }); 
     }else{ 
      socket.emit('dataResponse', { 
       response: 'transactions', 
       data: myTransactions[month] 
      }) 
     } 

    }); 

Единственная разница, которую я вижу между данными, заключается в том, что когда я статически инициализирую данные внутри контроллера, e - дополнительный ключ, называемый «HashKey», который отсутствует, когда данные отправляются с сервера. Я снова прочитал угловую документацию, но ничего не могу найти об этой проблеме.

Поблагодарили бы за любую помощь. (это не вопрос ng-repeat over an array of objects)

+1

вы пытались добавить $ объем $ применяется(); к последней строке dataResponse calback? –

+0

Спасибо, что, похоже, решили. Я прочитал об этом пару недель назад, но полностью забыл об этом – mem27

+0

рад видеть, что это помогло. поэтому вы собираетесь закрыть Q. –

ответ

1

$ scope. $ Apply();

для функции обратного вызова.

0

Как предложил Евгений Пен, добавив $ scope. $ Apply() обновляет представление для обновления данных. Добавление этого в конец обратного вызова dataResponse обновило данные на экране.

Эта статья (я забыл) объясняет немного более подробно, используя сокету с угловым. . http://www.html5rocks.com/en/tutorials/frameworks/angular-websockets/

Спасибо за ответы :)

Смежные вопросы