Question

我正在尝试创建一个带有可选＆＃34;标签的指令＆＃34;对于按钮 - 如果未提供此标签，我希望它具有默认值

这是指令

angular.module('myApp')
  .directive('myButton',function(){

    var ctrl = function ($scope) {
        var controller = this;

        controller.label = controller.label || 'Save';

        console.log("label=",controller.label);
    };

    return {
        replace: true,
        restrict: 'E',

        scope: {
            label: '@?',
        },

        templateUrl: 'directives/myButton.html',

        controller: ctrl,
        controllerAs: 'controller',
        bindToController: true,
    };
});

模板中的html是这个

<md-toolbar>
    <div class="md-toolbar-tools">
        <span flex></span>
        <md-button class="md-raised">{{controller.label}}</md-button>
    </div>
</md-toolbar>

我正在调用这个指令

<my-button label="fooBar"></my-button>

这是有效的 - 我看到标签＆＃34; fooBar＆＃34;在按钮上，＆＃39; label = fooBar＆＃39;在控制台上

但是，如果我不提供标签

<my-button></my-button>

按钮没有标签，但我看到＆＃39; label = Save＆＃39;在控制台上

我错过了什么？

感谢

Answer 1

您可以在指令上使用compile方法来实现所需的结果，一个小例子

.directive('my-bytton', [ function() {
    ...
    compile: function(element, attrs){
       if (!attrs.attrOne) { attrs.attrOne = 'default value'; }
       if (!attrs.attrTwo) { attrs.attrTwo = 'default value2'; }
    },
        ...
  }
});

设置角度指令属性的默认值

1 个答案: