AngularJS가 특정 데이터를 템플릿에 바인딩합니다.

Question

현재 녹아웃에서 각도로 전환 중입니다. 현재 당면한 가장 큰 문제점은 원본 템플릿을 Angular가 인식 할 수있는 것으로 옮기는 것입니다.

특히, 여기에 내가 전송시 문제가 있어요 코드의 비트는 다음과 같습니다

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

녹아웃,이 첨부됩니다 사각형 템플릿이 렌더링됩니다 때 있도록 [5] SquareTempl에, 그것은 않습니다 Squares [5] (또는 첨부 된 데이터)의 멤버를 사용합니다.

사각형 [0] ~ 사각형 [11]에 대한 과정을 반복해야합니다. 숫자 순으로 반복하지 않기 때문에 ng-repeat는 사용할 수 없습니다. 내가

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

어떤 아이디어가의 라인을 따라 뭔가를 할 수 있다면

이상적으로는 좋은 것?

다음은 ng-model을 사용하여 시도한 실패한 시도를 요약하기 위해 작성한 JSFiddle입니다.

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

Answer 1

두 가지 : 첫째, 당신은 당신이 다른 파일의 일부가 될 HTML을해야합니까, NG-데이터가 두 번째로 스스로 YourApp.directive("ngData", function() {})를 구현하여 사용할 수 있습니다 만들 수 있습니까? 쉬운 방법은 ng-repeat 등으로 각도에서입니다 무엇을 찾고있어 달성하기 위해 다음 Square 배열이 업데이트 될 때 추가 포스트

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

을 할 것입니다.

검토 수정 된 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> 

매우 추악하고 이상적이지 않은 I 알고있다. 또한 함수에서 순서 배열을 생성하고 수행하는 것이 좋습니다. ng-repeat="index in displayOrder(Squares)"