具有范圍和ng-controller的自定義angularjs指令

Question

我想創建同時具有范圍參數和ng-controler的指令。

這是該指令的外觀：

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

我在我的應用中的某個地方聲明了“ RegisteredController”。

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提供自定義指令，然后為該控制器提供其他范圍變量。

我該如何實現？

Answer 1

您必須使用標記包裝指令並將控制器放在此處。

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

無法在一個標簽中獲得兩個隔離的作用域。