2016-12-16 5 views
1

У меня возникает очень неприятная проблема, которую я не могу понять, и я не знаю достаточно, чтобы самостоятельно ее отлаживать.ng-repeat не отображает (если не изменена переменная области)

В принципе, у меня есть очень простой директиву, которая печатает «1,2,3», используя нг-повтор:

myApp.directive('foo', ['$compile', function($compile) { 
    return { 
     restrict: 'A', 
     link: function (scope, element, attrs) { 
       var template = '<ul><li ng-repeat="node in [1,2,3]">{{node}}</li></ul>'; 

       //Render template 
       angular.element(document).ready(function() { 
       element.html('').append($compile(template)(scope)); 
       }); 
     } 
    } 
}]); 

Эта директива работает практически в любой ситуации, за исключением при обновлении страницы в пользовательском интерфейсе -. Он работает, если я перехожу в состояние, содержащее директиву из другого состояния, но не если я просто загружу страницу в это состояние.

Вот что любопытно. Он волшебным образом начнет работать, если я просто изменю любую переменную области (неважно, какой из них). Вот скрипка, которую я создал, которая демонстрирует проблему.

http://jsfiddle.net/789Ks/247/

Является ли это UI-маршрутизатор ошибка? Я что-то не понимаю?

ответ

2

Попробуйте запустить scope.$apply после добавления шаблона:

angular.element(document).ready(function() { 
    element.html('').append($compile(template)(scope)); 
    scope.$apply(); 
}); 
+0

Это работало ... но почему? Иногда я ненавижу угловые области видимости – RPGillespie

+0

, потому что вы на мгновение вышли из углового мира. Вам нужно использовать '$ apply' для распространения изменений на Angular – Ladmerc

+0

@Ladmerc, который не объясняет, почему он работает при переходе состояния, но не на загрузку страницы – RPGillespie