AngularJs HTML 템플리트에 데이터를 전달하는 방법

Question

AngularJs HTML 템플리트가 있지만 템플리트는 표시되지만 <td> 태그 중 어느 것도 채워지지 않습니다. 구성 요소 JSON Object를 템플릿에 전달하는 방법에 대해 궁금합니다.

<div> 
    <h4>Alert</h4> 
    <table class="table"> 
     <tr> 
      <th>Type</th> 
      <td>{{component.type}}</td> 
     </tr> 
     <tr> 
      <th>Alert</th> 
      <td>{{component.alert}}</td> 
     </tr> 
    </table> 
</div> 

이 템플릿으로 데이터를 전달하려고하지만이를 수행하는 데 문제가 있습니다.

data: $scope.component이 문제의 원인입니다.

$scope.components = 
    [ 
    {type: "Mobilizer", alert:"mobilizer2 went down", status: "Down"}, 
    {type: "Dispacther", alert:"message rate is, status: "Problem"}, 
    {type: "Listener", alert:"No Alert", status: "Up"}, 
    {type: "OutBound Charge", alert:"No Alert", status: "Up"} 
]; 

    $scope.openDialog = function(component) { 
      ngDialog.open({ 
       templateUrl: 'handlebars/alert-template.html', 
       data: $scope.component 
      }); 
     }; 
    }) 

내 AngularJS와 함수를 호출하는 참조하십시오

<tr ng-repeat="component in components | orderBy:'status'" ng-click="openDialog(component)"> 
    <td>{{component.type}}</td> 
    <td ng-if="component.status == 'Up'" class="alert-success">{{component.status}}</td> 
    <td ng-if="component.status == 'Problem'" class="alert-warning">{{component.status}}</td> 
    <td ng-if="component.status == 'Down'" class="alert-danger">{{component.status}}</td> 
    </tr> 

Answer 1

$scope.component = component; 
     ngDialog.open({ 
      template: 'handlebars/alert-template.html', 
      scope: $scope 

내 함수 내에서 범위를 지정했다.