AngularJS привязывает определенные данные к шаблону

Question

В настоящее время я переключаюсь с Knockout на Angular. Основная проблема, с которой я сейчас сталкиваюсь, заключается в переносе моих оригинальных шаблонов на что-то, что Угловое распознает.

В частности, вот немного кода у меня возникают проблемы с передачей:

<!-- ko template: { name: 'SquareTempl', data: Squares[5] } --><!-- /ko -->

В Knockout, это будет придавать Квадраты [5], чтобы SquareTempl, так что, когда шаблон визуализируется, это делает поэтому используйте члены в пределах квадратов [5] (или любые другие данные, которые будут прикреплены).

Мне нужно повторить процесс для квадратов [0] ~ квадратов [11]. Я не могу использовать ng-repeat, так как я не буду повторять их в численном порядке.

В идеале было бы хорошо, если бы я мог сделать что-то вдоль линий

<td class="Square" id="five" ng-include src="'SquareTempl.html'" ng-data="Squares[5]">

Любые идеи?

Вот JSFiddle, который я написал, чтобы описать неудачную попытку, с которой я попытался использовать ng-model.

http://jsfiddle.net/fZz3W/9/

Answer 1

две вещи: во-первых, вы можете сделать нг-данные будут доступны по реализации его самостоятельно YourApp.directive("ngData", function() {}) Во-вторых, вам нужен HTML, чтобы быть частью другого файла? Самый простой способ сделать то, что вы ищете в угловом это с ng-repeat как:

<td ng-repeat="item in Square"> 
    <div>{{item.name}}</div> 
</td> 

Когда Square массива обновляется дополнительный пост будет.

Обзор ваш модифицированный JSFiddle: http://jsfiddle.net/TdWMF/1/

Так что это в основном рубить, чтобы достичь того, чего вы хотите, пока я не могу предложить вам лучшее решение:

Второе обновление, используя смешанный заказ ng-repeat: http://jsfiddle.net/TdWMF/3/

В основном:

<div ng-repeat="index in [4, 2, 0, 3, 1]"> 
    square index: {{index}}<br /> 
    square: {{Squares[index]}} 
</div> 

Довольно некрасиво, и неидеальный, я знать. Я также рекомендовал бы выполнить создание массива порядка в функции, а затем: ng-repeat="index in displayOrder(Squares)"