コンポーネントプロパティの変更がUIに反映されない

Question

私はリストコンポーネントとアイテムコンポーネントを持っています。リストコンポーネントは、サーバーからデータをフェッチし、アイテムコンポーネントを使用して各データをレンダリングします。 firebaseを使用して、サーバーからクライアントへのデータ変更をプッシュしていますか？

これは、リストコンポーネント

angular.module('app') 
    .component('orderList', { 
    templateUrl: 'templates/orders/list.html', 
    controller: function($rootScope, $scope, $element, $attrs, loading, popup, toast, orders) { 
     var vm = this; 

     vm.orders = []; 

     vm.$onInit = function() { 
     orders.all(). 
     then(function(data) { 
      vm.orders = data; 
     }) 

     firebase.database().ref('/orders/10'). 
     on('child_changed', function(snapshot) { 
      var order = vm.orders.filter(function(o) { return 0.id == snapshot.key })[0]; 
      if(order) { 
      var index = vm.orders.indexOf(order); 
      _.merge(vm.orders[index], snapshot.val()); 
      } 
     }) 
     } 
    } 
    }) 

アイテム成分

angular.module('app') 
    .component('orderItem', { 
    templateUrl: 'templates/orders/item.html', 
    bindings: { 
     item: '<' 
    }, 
    controller: function($rootScope, $scope, $element, $attrs) { 
     var vm = this; 
    } 
    }) 

リストコンポーネントHTML

<order-item ng-repeat="order in $ctrl.orders" item="order"></order-item> 

項目コンポーネントHTML

<div class="item-image"><img src="img/drawer-header-bg.png"></div> 
<div class="item-status">{{ $ctrl.item.status }}</div> 

0123であります

'child_changed'イベントが発生し、アイテムデータがfirebaseのデータとマージすると、ビューは更新されません。

Answer 1

角度のコンテキスト外のイベント内で範囲データを変更しています。任意のイベントと同様に

（。$スコープ$等...上;）あなたはスコープを更新する必要があります。私はorderList`コンポーネント `に添付されたテンプレートが表示されていない

$scope.$apply();