2014-12-19 4 views
0

Недавно я увидел приведенный ниже пример кода ng-repeat. Это выглядит очень просто, чем на официальном веб-сайте angularjs. Однако это не работает в моей локальной среде. В консоли нет сообщений об ошибках. Повторение ничего не показывает. Я был совершенно смущен. Что случилось с ng-repeat ниже?AngularJS повторный образец не работает

http://jsfiddle.net/331kfnk5/

<div ng-app> 
    <ul class="example-animate-container"> 
    <li ng-controller="orderprovider" class="animate-repeat" ng-repeat="i in items"> 
     {{i.id}} , {{i.total}} 
    </li> 
    </ul> 
</div> 
+0

Проверьте, правильно ли вы включили JS-файл в HTML. – Ved

ответ

0

Возьмите контроллер из нг-повтор:

<div ng-app> 
    <ul class="example-animate-container" ng-controller="orderprovider"> 
    <li class="animate-repeat" ng-repeat="i in items"> 
     {{i.id}} , {{i.total}} 
    </li> 
    </ul> 
</div> 

нг-повтор создает копию элемента DOM и в коде выше, он создает несколько экземпляров контроллера orderprovider , Работает plunker.

0

Обновлена ​​ваша скрипка.

http://jsfiddle.net/331kfnk5/4/

HTML

<body ng-app="app">   
    <div ng-controller="mainController"> 
     <ul class="example-animate-container"> 
      <li class="animate-repeat" ng-repeat="i in items"> 
       {{ i.id }} , {{ i.total }} 
      </li> 
     </ul> 
    </div> 
</body> 

JS

var app = angular.module('app', []); 

app.controller('mainController', function($scope) { 
    $scope.items = [ 
     { id: 'x10242458', total: 100, actual: 80 }, 
     { id: 'x10242408', total: 10, actual: 8 }, 
     { id: 'x10242308', total: 101, actual: 81 } 
    ]; 
}); 

Вы отсутствовали несколько ключевых вещей, как загрузка Угловое приложение, вы также включая контроллер на повторяемый элемент, которого я никогда раньше не пробовал, но я гу essing вызовет bad все должно случиться.

Оттуда это был случай добавления правильного закрытия контроллера и загрузки угловой рамки в правильное время.

Смежные вопросы