Question

我是一个有角色的新手，我必须错过一些简单的事情。我想要做的是通过使用角度ui创建工具提示。我创建了一个customer指令，它将根据占位符值为元素的属性添加3个angular指令：

myApp.directive('ngTooltip', function () { 
    return{
        restrict: 'A',
        link: function (scope, element, attrs) {
            attrs.$set('tooltip', attrs['placeholder']);
            attrs.$set('tooltip-placement', 'bottom');
            attrs.$set('tooltip-trigger', 'focus');
        }
    }
});

在我的标记中，我有

它按预期呈现：

<input name="test" placeholder="this is test" tooltip="this is test" tooltip-placement="bottom" tooltip-trigger="focuse" />

但是，工具提示不起作用。如果我直接将3个工具提示属性应用于标记，则工具提示可以正常工作。

看起来自定义指令添加的3个指令不会被angularjs评估。

有什么想法吗？

Answer 1

如果不使用$compile重新编译元素，则无法动态添加指令，这将导致无限循环，除非您采用某种解决方法。有一种更简单的方法可以解决这个问题：声明一个指令模板，AngularJS将正确处理这些指令。

myApp.directive('ngTooltip', function () { 
    return{
        restrict: 'A',
        template: '<input tooltip tooltip-placement="bottom" tooltip-trigger="focus">',
        replace: true,
        link: function (scope, element, attrs) {
          attrs.$set('tooltip', attrs['placeholder']);
        }
    }
});

工作示例：plunker。

如何使用custom指令添加其他angularjs指令

1 个答案: