Question

我有两个指令和一个控制器，问题是我不能调用一个函数＆＃39; addMarkers（）＆＃39;来自我的指令的控制器。

我有以下代码：

derectives.js

＆＃13;

app
.directive('collection', function () {
    var tpl = '<ul><member ng-repeat="member in collection" member="member"></member></ul>';
    return {
        restrict: "E",
        replace: true,
        scope: {
            collection: '='
        },
        template: tpl
    }
})

app
.directive('member', function ($compile) {
    var tpl = '<li><a ng-click="addMarkers(member)" >{{member.title}}</a>'+
              '<input class="align" ng-if="!member.children" type="checkbox" ng-checked="true"/></li>';
    return {
        restrict: "E",
        replace: true,
        scope: {
            member: '=' 
        },
        template: tpl,
        link: function (scope, element, attrs) {
            if (angular.isArray(scope.member.children)) {
                element.append("<collection collection='member.children'></collection>"); 
                $compile(element.contents())(scope)
            }
        }



    }
})

＆＃13;

controller.js

＆＃13;

app
    .controller('IndexCtrl', function($scope, itemProvider){

    itemProvider.getItems().success(function(data){
     $scope.items  = data;
    });

   $scope.addMarkers = function(item){
         alert("Helloo");
        $scope.markers = itemProvider.addMarkers();
    }
   });

＆＃13;

的index.html

＆＃13;

	<div id="menu" ng-controller="IndexCtrl">
			<nav>
				<h2><i class="fa fa-reorder"></i>All Categories</h2>
				<collection collection='items'></collection>
			</nav> 
</div>

＆＃13;

Answer 1

$ rootScope是全局范围，只有在需要时才应使用。它应尽可能保持清洁，以避免污染范围变量。

要从隔离范围访问父方法，您可以使用$ parent服务，如下所示：

scope.$parent.addMarkers();

示例：basic example

在你的情况下，再次从另一个指令内部调用想要访问父节点的指令，因此在这种情况下你可以使用$ parent。$ parent，

scope.$parent.$parent.addMarkers();，如下所示：

例如：example for your case

如果使用父作用域的指令数量有限，则可以执行此操作。如果层次结构很长，那么使用多个$ parent会使代码变得笨拙。在这些情况下，最好在服务中添加父方法，并从指令调用服务本身。

示例：service example

Answer 2

我应该使用$ rootScope而不是下面的$ scope，

$rootScope.addMarkers = function(item){
     alert("Helloo");
     $scope.markers = itemProvider.addMarkers();
}

如何从ng-click指令调用控制器函数？

2 个答案: