在 AngularJS 中动态添加指令答案

【问题标题】：dynamically added directive in AngularJS在 AngularJS 中动态添加指令
【发布时间】：2013-10-21 23:21:17
【问题描述】：

我正在编写自定义指令。我希望指令向元素添加 ng-click 属性 attrs.$set('ng-click','clicked()'); 我已经尝试在编译函数中添加 ng-click 指令，以及 pre 和 post 链接函数。该属性已添加但不起作用。我很欣赏任何见解。谢谢！

.directive('myDir', function () {
        return{
            compile: function (tElement, tAttrs, transclude) {

                //tAttrs.$set('ng-click','clicked()');

                return {
                    pre: function (scope, element, attrs) {
                       //attrs.$set('ng-click','clicked()');
                    },
                    post: function (scope, element, attrs) {
                      //attrs.$set('ng-click','clicked()');  

                        scope.clicked = function(){
                            console.log('clicked!!!');
                        };
                    }
                };
            }
        };
    });

【问题讨论】：

标签： angularjs angularjs-directive

【解决方案1】：

你已经通过 jQuery 添加了属性，所以 Angular 不知道它。快速的答案是将调用包装在一个范围内。$apply:

scope.$apply(function() {
  tAttrs.$set('ng-click','clicked()');
});

所以 Angular 知道你改变了它。

但对于其他可能更干净地与 Angular 一起工作的方法，请查看 What is the best way to conditionally apply attributes in Angular?

【讨论】：