내에서 전달 될 때 나는 내가 드래그 대화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를 사용하는 다른 지시문과 함께 사용할 때 격리 된 범위의 양방향 바인딩을 사용할 수 없습니다.
왜 당신이 고립 범위를 사용하지 않으 도움이? 그것은 당신의 문제를 해결할 것입니다 –
안녕 알렉스, 나는 고립 된 범위를 사용할 수 없습니다. 왜냐하면 나는이 지시어를 고립 된 스코프 변수와 같은 $ scope.task를 취해야하는 또 다른 요소 지시어와 함께 사용하기 때문이다. 두 지시어는 동일한 범위 변수에 걸릴 수 없다고 불평하는 각도 – Tianhai