1

내에서 전달 될 때 나는 내가 드래그 대화AngularJS와 : 속성이 ngRepeat

var myApp = angular.module("myApp", []); 
myApp.controller('myCtrl', function ($scope) { 
    $scope.tasks = [{ 
     name: 'learn angular', 
     show: false 
    }, { 
     name: 'build an angular app', 
     show: false 
    }]; 
    $scope.showBox = function (taskname) { 
     for (var i = 0; i < $scope.tasks.length; i++) { 
      if ($scope.tasks[i].name === taskname) { 
       $scope.tasks[i].show = !$scope.tasks[i].show; 
      } 
     } 
    } 
}); 
myApp.directive("draggableDialog", function() { 
    return { 
     template: 'task: {{task.name}}', 
     link: function (scope, element, attrs) { 
      element.dialog({ 
       title : "My Dialog", 
       autoOpen: false 
      }); 
      element.bind("dialogclose", function() { 
       if (!scope.$$phase) { 
        scope.$apply(function() { 
         scope[attrs.draggableDialog] = false; //here is the problem 
        }); 
       } 
      }); 
      scope.$watch(attrs.draggableDialog, function (v) { 
       if (v) { 
        element.dialog("open"); 
       } else { 
        element.dialog("close"); 
       } 

      }); 
     } 
    } 
}); 

에 템플릿을 변환 JQuery와 사용하는 간단한 AngularJS와 지침이 고립 범위를 사용하지 않고 지시에 부모 범위를 업데이트하는 방법

<div> 
    <h2>Draggable Dialog</h2> 
    <div ng-controller="myCtrl"> 
     <ul class="unstyled"> 
      <li ng-repeat="task in tasks"> 
       <button ng-click="showBox(task.name)">show {{task.name}}</button>{{task.show}} 
       <div draggable-dialog="task.show">test</div> 
      </li> 
     </ul> 
    </div> 
</div> 

이 바이올린을 참조하시기 ngRepeat이 지시어를 사용 : 사용자가 수동으로 대화 상자를 닫으면 http://jsfiddle.net/tianhai/BEtPk/#base

것은, 나는 이벤트를 감지 할 수 있습니다 myCtrl의 $ scope.task [i] .show를 false로 설정하려고합니다. 내가 어떻게 해? 필자는이 지시문을 $ scope.task를 사용하는 다른 지시문과 함께 사용할 때 격리 된 범위의 양방향 바인딩을 사용할 수 없습니다.

+0

왜 당신이 고립 범위를 사용하지 않으 도움이? 그것은 당신의 문제를 해결할 것입니다 –

+0

안녕 알렉스, 나는 고립 된 범위를 사용할 수 없습니다. 왜냐하면 나는이 지시어를 고립 된 스코프 변수와 같은 $ scope.task를 취해야하는 또 다른 요소 지시어와 함께 사용하기 때문이다. 두 지시어는 동일한 범위 변수에 걸릴 수 없다고 불평하는 각도 – Tianhai

답변

2

당신은 당신이 scope[attrs.draggableDialog] = false을 수행 할 때 그래서 당신이 범위에 부착 된 요소와 끝까지 "task.show"당신은 일반적으로 세트에 scope['task']['show'] 또는 scope.task.show

다른 어떤 scope['task.show']에 액세스 할 수 할 수 attrs.draggableDialog 세트를 가지고 parent 변수를 false로 설정하면 할당을 포함하는 문자열을 평가해야합니다. 당신을 위해 그 결과는 다음과 같습니다

scope.$eval(attrs.draggableDialog + ' = false;'); 

희망이

+0

안녕하세요, 문제를 이해합니다. 그러나이 지시문이 ngRepeat 내에서 또는 실제 구현에서 두 번째 수준의 중첩 된 ngRepeat로 어디서든 사용할 수있는 일반 지시문이되기를 바랍니다. – Tianhai

+0

오, 좋아, 그 문제를 해결하기위한 답을 편집했습니다 – hassassin

+0

고마워요! 그것은 작동합니다! 나는 무언가를 배웠다!! – Tianhai