Question

我正在创建一个角度指令，我希望用户指定一个＆＃39;类型＆＃39;指令。

例如：

<my-directive type-a></my-directive>

或

<my-directive type-b></my-directive>

或

<my-directive type-c></my-directive>

我知道我能做到：

<my-directive type="a"></my-directive>

然后需要type属性，然后我进行字符串匹配。无论如何要通过要求其中一种类型-a＆＃39;，＆＃39; type-b＆＃39;或＆＃39; type-c＆＃39;出席？

Answer 1

没有太多背景信息，我想出了这个解决方案。

JSFIDDLE

所以基本上myDirective有一个控制器，由类型指令共享（type-a，type-b ..等等）。 type指令设置myDirective范围内的类型。

myApp.directive('myDirective', function() {

    return {
        restrict: 'E',
        controller: function($scope) {
            $scope.type = '';

            this.setType = function(type){
                if($scope.type === '') $scope.type = type;
                else throw 'type can be only defined once. Current type is '+$scope.type
            }
        },
        link: function(scope, elem, attrs) {
            console.log(scope.type);
        }
    }
});


myApp.directive('typeA', function() {
    return {
        restrict: 'A',
        require: '^myDirective',
        link: function(scope, elem, attrs, ctrl) {
            ctrl.setType('typeA');
        }
    }
});

myApp.directive('typeB', function() {
    return {
        restrict: 'A',
        require: '^myDirective',
        link: function(scope, elem, attrs, ctrl) {
            ctrl.setType('typeB');
        }
    }
});

Answer 2

我认为你可以做<div data-my-directive="a"></div>这对跨浏览器和w3c来说更安全。然后该指令将类似于：

.directive('myDirective', function() {
  return {
    restrict: 'A',
    scope: {
      type: '='
    },
    link: function(scope,element,attrs){
    }
  };
});

在指令中的选项之间需要一个属性

2 个答案: