zeekapitein Ответов: 0

Как использовать НГ-сортировки во вложенных директив

Привет


Я хочу использовать НГ-сортировки во вложенных директив. Я всегда получаю ошибку: Ошибка: несколько директив [collection, ngSortable] запрашивают изолированную область действия. Возможно ли это вообще ?


Мой код :

<!doctype html>
<html ng-app='APP'>
	<head>
<meta name="description" content="Angular Nested recursive directives" />
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular.min.js"></script>
	<!-- AngularJS -->

  <!-- Sortable.js -->
  
 <!-- AngularJS -->
  <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.2/angular.min.js"></script>

  <!-- Sortable.js -->
  <script src="http://rubaxa.github.io/Sortable/Sortable.js"></script>

  <!-- ng-sortable.js -->
  <script src="http://rubaxa.github.io/Sortable/ng-sortable.js"></script>

  </head>
	<body>
		<div>
			<collection collection="tasks">
		</div>
	</body>
</html>



angular.module('APP', ['ng-sortable'])

.directive('collection', function () {
	return {
		restrict: "E",
		replace: true,
		scope: {
			collection: '='
		},
		template: "<ul><member ng-repeat="member in collection" member="member"></ul>"
	}
})

.directive('member', function ($compile) {
	return {
		restrict: "E",
		replace: true,
		scope: {
			member: '='
		},
		template: "<li>{{member.name}}</li>",
		link: function (scope, element, attrs) {
            var collectionSt = '<collection collection="member.children">';
			if (angular.isArray(scope.member.children)) {       
              
                $compile(collectionSt)(scope, function(cloned, scope)   {
  	  	     	  	element.append(cloned); 
  	  	  	  	  });
			}
		}
	}
})
 
.controller('IndexCtrl', function ($scope) {
	$scope.tasks = [
		{
			name: 'Europe',
			children: [
				{
					name: 'Italy',
					children: [
						{
							name: 'Rome'
						},
						{
							name: 'Milan'
						}
					]
				}, 
				{
					name: 'Spain'
				}
			]
		}, 
		{
			name: 'South America',
			children: [
				{
					name: 'Brasil'
				},
				{
					name: 'Peru'
				}
			]
		}
	];
});



JSBIN :
ДЕМО JSBIN
С уважением

Что я уже пробовал:

Обертывание дополнительных элементов div вокруг html-шаблона.

0 Ответов