带范围和ng-controller

时间:2016-07-29 10:12:03

标签: javascript angularjs angular-directive ng-controller

我想创建具有范围参数和ng-controler的指令。

这是该指令的外观:

<csm-dir name="scopeParam" ng-controller="RegisteredController">
   <!--Here I want to have content--> 
   {{name}}
</csm-dir>

我在我的应用程序中的某处声明了“RegistertedController”。

angular.module('app')
    .controller('RegisteredController', ['$scope', function ($scope) {
        //$scope.name should be accessible here
    }]);

我正在尝试宣布指令:

angular.module('app')
    .directive('csmDir', [function () {
        return {
            restrict: 'AE',
            replace: true,
            transclude: true,
            scope: {
                name: '='
            },
            template: '<section class="layout"><ng-transclude></ng-transclude></section>',
            link: function (scope, element, attr, ctrl, transclude) {
                element.find('ng-transclude').replaceWith(transclude());
                //here I also need scope.name parameter
            }
       };
    });

我收到错误:

Multiple directives [ngController, csmDir] asking for new/isolated scope on: <csm-dir name="scopeParam" ng-controller="RegisteredController">

现在这个错误是非常有用的,而且我认为角度不能像我想的那样工作。

我可以从指令中删除“scope:{..}”参数并在控制器中定义它,但这不是我需要的。

我需要的是基本上为自定义指令提供ng-controller,然后为该控制器提供额外的范围变量。

我怎样才能做到这一点?

1 个答案:

答案 0 :(得分:0)

您必须使用标记包装您的指令并将控制器放在那里。

<div ng-controller="RegisteredController">
   <csm-dir name="scopeParam">
       <!--Here I want to have content--> 
       {{name}}
   </csm-dir>
</div>

无法在一个标记中获得两个隔离的范围。