Question

这是一个从文件加载新模板的指令：

.directive('candidatesFilter', function(){
    return {
        resctict: 'E',
        replace: true,
        templateUrl: 'views/directives/filters/AAAA.html' 
    }
})

下一个HTML元素从其他HTML模板（例如xxx.html）调用此指令：

<candidates-filter></candidates-filter>

此父模板（xxx.html）有下一个控制器：

app.controller('candidatesController', function($scope, $location ){

    $scope.addPeson = function() {
        $location.url('/candidate/0');
    };

});

方法addPerson（）无法在指令模板 AAAA.html 中访问，因为

data-ng-click="addPerson()"

不在那里工作。如何更改指令以使指令模板中的addPerson（）方法可用？

TEMPORARY解决方案 我通过下一个解决方案解决了这个问题

.directive('candidatesFilter', function(){
    return {
        resctict: 'E',
        replace: true,
        templateUrl: 'views/directives/filters/AAAA.html', 
        controller: function(){
            $('button.add').on('click',function(){
                location.hash = '#/candidate/0';
            });
        }
    }
})

Answer 1

如果我理解正确的问题：

您可以将函数传递给指令以供其使用

<candidates-filter></candidates-filter>

变为

<candidates-filter add-candidate="addPerson()"></candidates-filter>

并且指令定义更改如下：

.directive('candidatesFilter', function() {
return {
    resctict: 'E',
    replace: true,
    scope: {
        addCandidate: '&addCandidate'
    }
    templateUrl: 'views/directives/filters/AAAA.html'
    link: function(scope, element, attrs) {
        scope.someFunctionInDirective = function() {
            scope.addCandidate();
        }
    };
}
})

或者你也可以通过按钮

按正常方式调用它

希望这有助于澄清它吗？

Angular：控制器的方法在指令模板中不起作用

1 个答案: