Динамически загружать шаблон внутри ng-repeat

Я пытаюсь динамически загружать шаблон в ng-repeat:

<ul>
    <li ng-repeat="prop in entity" >
        <div ng-include src="prop.template"></div>
    </li>
</ul>

prop.template равен URL-адресу шаблона, например. 'partials/form/text.html'. Приведенный выше код вызывает следующую ошибку:

Error: 10 $digest() iterations reached. Aborting!
Watchers fired in the last 5 iterations: [["prop.template; newVal: \"partials/form/text.html\"; oldVal: undefined","prop.template; newVal: \"partials/form/text.html\"; oldVal: undefined" .... (and so on)

Как получить URL-адрес шаблона из prop.template и вставить HTML из этого файла в DOM внутри ng-repeat?

Ответы

Ответ 1

http://docs.angularjs.org/api/ng. $rootScope.Scope # $digest

Обработать всех наблюдателей текущей области и ее детей. Поскольку слушатель-наблюдатель может изменить модель, $digest() продолжает называть наблюдателей, пока больше не слушаются слушатели. Это означает, что можно попасть в бесконечный цикл. Эта функция будет выдавать "Максимальный предел итерации". если число итераций превышает 10.

Проблема здесь не в коде, она должна работать отлично. См. Рабочий пример здесь: http://jsfiddle.net/fmjf8/2/

Проблема заключается либо в том, что у вас может быть слишком много элементов в вашем массиве ngRepeat, либо в шаблоне вашего массива, или в шаблоне, который вы включаете, делается слишком много вещей, создавая бесконечную защиту цикла angular. Я голосую за вторую

Ответ 2

Я знаю, что это немного не связано, но я искал похожую проблему, и мои поиски привели меня сюда в какой-то момент. И поскольку в интернете не так много источников об ангулярности, я пишу это здесь для других несчастных людей.

Моя проблема с ng-include:

У меня были представления шаблонов (html файлов), загруженные с помощью ng-view из параметров маршрута, и ng-include ссылался на один из этих шаблонов внутри другого. Это произвело точно такой же отклик на angular стороне.

Насколько я понимаю, это происходит:

Когда ng-include пытается внедрить html файл шаблона в исходный, он пытается сделать это с нуля, то есть все перезагружается, включая исходный html файл, общие файлы, все шаблоны;

templateX. html-> ng-include (templateY) → templateX.html → templateY.... так что настоящий бесконечный цикл, дайджест только предотвращает сбой вашего браузера из-за чрезмерного DOM.

Затем я попытался использовать полные пути вместо любых относительных, и это решило мою проблему.

Возможно, вы можете использовать полные пути внутри ng-include, чтобы решить вашу проблему.

Надеюсь, это немного поможет.