2013-10-04 4 views
1

모달 창 (http://angular-ui.github.io/bootstrap/ 참조)을 사용하려고합니다. I는 다음과 같은 기능을 갖고 상위 제어기 모달 창 (AngularJS 지시문)의 범위

:

var ModalInstanceCtrl = function ($scope, $modalInstance, year, month, day, todos) { 
... 
    $scope.todos = todos; 
    $scope.addTodo = function() { 
     $scope.todos.push({ TodoText: $scope.todoText.value, Done: false, Del: false, Date: new Date(year, month, day), Priority: 1, New: true}); 
     $scope.todoText.value = ""; 
    }; 
... 
$scope.ok = function() { 
    $modalInstance.close($scope.todos); 
    }; 
}; 

상위 감안 todos와 캘린더가 도시되어

$scope.open = function() { 

     var modalInstance = $modal.open({ 
      templateUrl: 'myModalContent.html',    
      controller: ModalInstanceCtrl, 
      resolve: { 
      year: function() { 
       return $scope.year.value; 
      }, 
      month: function() { 
       return $scope.month; 
      }, 
      day: function() { 
       return $scope.day.name; 
      }, 
      todos: function() { 
       return $scope.day.toDoItems; 
      } 
     }, 
     backdrop: 'static' 
    }); 

    modalInstance.result.then(function (todos) { 
     angular.forEach(todos, function (todo) { 
      if (todo.New) 
       $scope.day.toDoItems.push(todo); 
     });    
    }, function() { 
     $log.info('Modal dismissed at: ' + new Date()); 
    }); 
}; 

모달 제어기에 addTodo 함수가

하루에. 하루 헤더를 클릭하면 모달 창이 열리고 추가 기능을 추가 할 수 있습니다. 제 문제는 모달 윈도우에서 todos를 추가 할 때 동시에 todos이 부모 뷰에 추가된다는 것입니다. 이제 todos이 부모보기에서 두 번 추가되었습니다. 한 번 모달보기에 추가되고 모달보기에서 확인을 클릭합니다. 그러나 모달 뷰에서 확인을 클릭 할 때만 부모보기에 todos 항목을 추가하려고합니다.

누구에게도 해결책이 있습니까? 미리 감사드립니다!

어떻게 작동하는지 당신은 Plunker에서 볼 수

: http://plnkr.co/edit/Nr1h7K3WZyWlRlrwzhM3?p=info

+1

당신은 바이올린에 있음을 설명 할 수 있습니까? –

+0

Plunker에서 링크를 추가했습니다. HTML 태그를 Fiddle로 편집 할 수 없습니다 (그리고 ng-app를 지정해야합니다). – Tenzi

답변

2

당신의 해결 객체에서 모달 컨트롤러에 대해 당신이 실제로 당신이 당신의 모달의 컨트롤러 $scope.todos = todos;에 할당 할 때 그렇게 참조로 다시 부모의 범위 일하러 객체를 전달하고 실제로는 부모의 todos 범위 변수를 가리 킵니다. 변수에 대한 참조 대신 부모의 todos 복사본을 반환 할 수 있습니다.

todos: function() { 
    return angular.copy($scope.day.toDoItems); 
} 

http://plnkr.co/edit/Ty10C8JOKHlwb2bWA89r?p=info

관련 문제