2013-10-24 3 views
0

하위 작업이있을 수있는 작업 목록이 있습니다. 이것은 중첩 구조이고 전체 트리를로드하고 싶지 않습니다. 루트 수준 만로드 한 다음 사용자 요구에 따라 각 분기를로드하고 싶습니다.중첩 된 ngInclude로 바인딩 중단

<div ng-repeat="task in tasks" class="task"> 
    {{task.name}} 
    <a href ng-click="expand(task)">expand</a> 
    <a href ng-click="remove(task, tasks)">remove</a> 
    <div ng-show="task.subtasks" ng-init="tasks = task.subtasks" ng-include="'tasks.html'"></div> 
</div> 

컨트롤러 : 사용자가 지점 및 하위 작업을 확장

app.controller 'MainCtrl', ($scope, $http) -> 
    $http.get('tasks.json').then (tasks) -> 
    $scope.tasks = tasks.data 

    $scope.expand = (task) -> 
    if !task.subtasks 
     $http.get("subtasks.json").then (tasks) -> 
     task.subtasks = tasks.data 
    task.expanded = yes 

    $scope.remove = (task, list) -> 
    list = _.reject list, id:task.id 

가로드되는, 그것은하지 않습니다 그래서 내가 여기 TAKS의 목록을 전달하는 ng-includesng-init을 중첩하고 사용하고있어 템플릿입니다 업데이트보기, 그래서 ng-include 새 하위 범위를 만듭니다 가정합니다. 이 문제를 어떻게 처리 할 수 ​​있습니까?

는 여기에 내가 커피 스크립트에 정통하지 오전이 http://plnkr.co/edit/AkIZV1PkD5a3AzCBen8R

답변

0

에 대한 쿵하는 소리입니다. 그러나 문제는 task=task.subtasks을 할당 한 ng-init이 ng-init 중에 비동기 원격 호출로 인해 task.subTasks가 정의되지 않았기 때문에 작동하지 않는다는 것입니다.

이 문제를 해결하는 한 가지 방법은 작업 데이터를 각 하위 작업 배열을 비어 []으로 설정하는 것입니다.

그런 다음 subTasks 데이터를 가져 오면 재 지정보다는이 배열을 채 웁니다. 이러한

//For each subtask item from server result 

//task.subtasks.push(subtask); 
+0

로 여기에 내가 당신의 생각 http://plnkr.co/edit/jUSli6m1uz63BJj7Rom3을 시험 쿵하는 소리지만이 도움이되지 않습니다. 나는'task.subtasks'가 정의되지 않았다는 사실이 문제가 아니라고 생각합니다. $ scope.tasks는 어느 시점에서 정의되지 않았지만 문제가되지는 않습니다. – SET

+0

생성 된 HTML을 보면, 자식을 생성하고 있습니다. , 그러나 그들은 숨겨져 있습니다. – Chandermani

+0

죄송합니다. 내 잘못입니다. 고맙다, 일한다. – SET