Angular JS - 具有默认行为的动态指令答案

【问题标题】：Angular JS - Dynamic directive with default behaviourAngular JS - 具有默认行为的动态指令
【发布时间】：2014-12-23 18:35:32
【问题描述】：

我希望开发人员在使用特定指令时能够使用他选择的控制器。这里解释了这是如何实现的：https://stackoverflow.com/a/23647720/1279730

但是，如果没有设置控制器，我还希望有一个“默认”行为。在“概念”中，这可能看起来像：

angular.module('myApp',[]).
directive('addIcons', function(){
return {
    restrict : 'A',
    scope:{},
    controller : function ($scope, $element, $attr) {
         // A default implementation
         var default = function () { $scope.name = "baz"; }

         // return the controller which handles this "request"
         return $attr.controllerName ? $attr.controllerName : default;
    },
    template:'<input type="button" value="(+) plus" ng-click="add()">'
  }
})

感谢您的帮助:)

【问题讨论】：

标签： javascript angularjs angularjs-directive

【解决方案1】：

您仍然可以在编译阶段添加控制器名称，它可以像这样使用：

var app = angular.module('myApp', []).
    directive('communicator', function () {
        return {
            restrict: 'E',
            scope: {},
            template: "<input type='text' ng-model='message'/><input type='button' value='Send Message' ng-click='sendMsg()'><br/>",
            controller: "@",
            name: "controllerName",
            compile: function (tElements, tAttributes) {
                tAttributes.controllerName = tAttributes.controllerName || "LandlineCtrl"
                return;
            }
    }})

【讨论】：