火力地堡和Angularjs對象範圍陣列未定義

Question

我試圖來顯示使用angularjs對象。但在html中顯示爲未定義。

app1.controller('ctrl1' , function($scope){ 
    categories = []; 
    var dbRef = firebase.database().ref().child('Categories/'); 
    dbRef.once('value', snap => { 

    snap.forEach(function(childSnap) { 
     //CATEGORY MODEL 
     var category = { 
      name : "", 
      id : "", 

      subCategories: { 
       name: "", 
       id: "" 
      } 

     }; 
     category.id = childSnap.val().id 
     category.name = childSnap.val().name 
     category.subCategories = childSnap.val().subCategories 
     categories.push(category) 
    }) 

    }).then(() => { 
    $scope.allcats = categories; 
    }); 
}); 

和HTML

<div id="nav-aside " class="nav" ng-controller="ctrl1"> 
       {{allcats}} 
      <ul class="nav-aside-list" ng-repeat="categories in allcats"> 
       <li><span></span><a href="#">{{categories.name}}</a></li> 
      </ul> 
      </div> 

這行不通。任何人都可以幫忙？ 在此先感謝！

Answer 1

你的代碼改成這樣：

app1.controller('ctrl1' , function($scope){ 
     $scope.allcats = []; 
     var dbRef = firebase.database().ref().child('Categories/'); 
     dbRef.once('value', snap => { 

     snap.forEach(function(childSnap) { 
      //CATEGORY MODEL 
      var category = { 
       name : "", 
       id : "", 

       subCategories: { 
        name: "", 
        id: "" 
       } 

      }; 
      category.id = childSnap.val().id 
      category.name = childSnap.val().name 
      category.subCategories = childSnap.val().subCategories 
      $scope.allcats.push(category); 
      $scope.$apply(); 
     }) 

     }).then(() => { 
     console.log($scope.allcats); 
     }); 
    });