如何在angularjs中的HTML頁面上顯示來自控制器的內容？

Question

我是angularjs的新手。我試圖顯示從控制器到HTML的內容，但我在控制檯中獲取數據，我無法在瀏覽器上顯示它。

我的HTML代碼：

<ion-list > 
     <ion-item ng-repeat="item in taskdetails" item="item" class="item-remove-animate item " class="itembg" on-swipe-right="showcard(item._id)" on-hold=" data.showReorder = !data.showReorder"> 
     <span class="toptask" ng-hide="task.hide"> 
    <span style="opacity:0.8"> {{ item.title| limitTo:10 }}<span ng-show="item.title.length> 10"><b> ...</b></span></span> 
     <small class="time " style="float:right;"> <i class="button button-icon icon ion-play balanced" ng-class="{ 'ion-pause assertive': !data.paused, 'ion-play balanced': data.paused}" ng-click="play5(item.id)" ></i> 
      </small> 
     <div style="float:right;margin-right:5px; font-size: 32px; 
    position: absolute; 
    right: 10px; 
    top: 10px; 
    color: black;" class="time icon "> 
      <i ng-class="{ 'ion-gear-b': data.paused, 'ion-loading-c spin': !data.paused}" class=" icon balanced" ng-click="showcard(item.id)"></i> 
     </div> 
     </span> 
      </ion-item> 
      </ion-list> 

控制器

$scope.openTasks = function (impFlag, urgFlag) { 
     console.log("important came as: " + impFlag + " , urgent falg came as: " + urgFlag); 
     quadrantservice.gettask.get({ 
      important: impFlag, 
      urgent: urgFlag 
     }).$promise.then(function (result) { 
      $scope.taskdetails = result; 
      console.log('task detailssssssssssssss' + JSON.stringify($scope.taskdetails)); 
      /*$state.go('listoftask', { 
       important: impFlag, 
       urgent: urgFlag 
      });*/ 
     }); 

$state.go('/listostasks'); 
    } 

我得到在控制檯中的數據，但我不能夠顯示它 'listoftasks' 狀態。

Answer 1

您需要$監視您的數據更改，因爲內部數據不可用，因此您需要觀察更改並相應地反映它。

$scope.$watch('taskdetails',function(newVal){ 
      if(typeof newVal !='undefined'){ 
      $scope.taskdetails=newVal; 
      } 
}); 

//將它放置在您的主控制器中。