Контроллеры в AngularJS

Question

Я пытаюсь использовать приложение AngularJS и получаю некоторые нечетные результаты.

В view2.html у меня есть:

<div ng-controller="view_ctrl_2"> 
    <div id="view2"> 
     <table class="table table-striped"> 
      <thead> 
       <tr> 
        <td>col1</td> <td>col2</td> <td>col3</td> <td>col4</td> 
       </tr> 
      </thead> 
      <tr ng-repeat="entry in entries"> 
       <td>{{entry.col1}}</td> <td>{{entry.col2}}</td> <td>{{entry.col3}}</td> <td>{{entry.col4}}</td> 
      </tr> 
     </table> 
    </div> 
</div> 

и в моем controllers.js файл У меня есть

angular.module('myApp.controllers', []) 
    .controller('view_ctrl_2', [function() { 
     var entries = [ 
       { "col1":"val01", "col2":"val02", "col3":"val03", "col4":"val04" }, 
       { "col1":"val05", "col2":"val06", "col3":"val07", "col4":"val08" }, 
       { "col1":"val09", "col2":"val10", "col3":"val11", "col4":"val12" } 
     ]; 
    }]); 

Однако, я не получаю никакого вывода на этой странице. Он показывает таблицу, но ng-repeat не помещает на нее никаких строк. Я предполагаю, что мне не хватает что-то делать с переменной $ scope?

Answer 1

Вам нужно добавить entries в $ объеме:

angular.module('myApp.controllers', []) 
    .controller('view_ctrl_2', ['$scope', function($scope) { 
     $scope.entries = [ 
       { "col1":"val01", "col2":"val02", "col3":"val03", "col4":"val04" }, 
       { "col1":"val05", "col2":"val06", "col3":"val07", "col4":"val08" }, 
       { "col1":"val09", "col2":"val10", "col3":"val11", "col4":"val12" } 
     ]; 
    }]); 

Пожалуйста, обратите внимание, что $scope впрыскивается в контроллер ['$scope', function($scope)... и использование $scope.entries= вместо того var entries=

Для дальнейшей разработки, все зависимости для контроллера необходимо ввести. Если вы делали какие-то http-звонки и использовали обещания, это выглядело бы так:

.controller('view_ctrl_2', ['$scope', '$q', '$http', function($scope, $q, $http)