5

我有一个开源项目，我正在努力升级以使用 angular 1.2rc3。本质上它处理表单按钮上的承诺。在这个 plnkr http://plnkr.co/edit/vQd97YEpYO20YHSuHnN0?p=preview中，您应该能够单击右侧的“保存”并在控制台中看到“单击”，因为它应该在指示：

            scope[functionName] = function () {
                console.log('clicked');
                //if it's already busy, don't accept a new click
                if (scope.busy === true) {
                    return;
                }

                scope.busy = true;
                var ret = scope.$eval(onClick);
                if (angular.isDefined(ret) && ret.hasOwnProperty('then')) {
                    ret.then(function () {
                        scope.busy = false;
                    });
                }
            };

在 1.2 中，尽管执行了以下代码，但不再执行此方法：

            if (angular.isDefined(attrs.ngClick)) {
                console.log('test');
                attrs.$set('ngClick', functionName + '()');
            }

我一直无法弄清楚为什么这个功能不会被执行....有什么想法吗？

4

2 回答 2

3

你真的不应该从你的链接函数中修改 ng-click 属性。我认为它曾经对您有用是侥幸，而修改优先级是一种技巧。我认为有一种更简单的方法可以做你想做的事情。看一下修改后的 plunkr：

http://plnkr.co/edit/EypQbCc5wpw5xBWSiVuA?p=preview

我将您的指令修改为忙点击并完全替换 ng-click。使用和操作 ng-click 没有意义（这是一个非常简单的指令）。如果您有任何问题，请告诉我。

顺便说一句，如果您确实需要添加或修改指令，您可以通过编译函数来完成，而不是通过链接函数。

    directive('busyClick', function () {
    return {
        restrict: 'A',
        scope:{
          busyClick: '&',
          busyText: '@'
        },
        link: function (scope, el, attrs) {

            el.on('click', function(){
                scope.$apply(function(){

                  console.log('clicked');
                  //if it's already busy, don't accept a new click
                  if (scope.busy === true) {
                    return;
                  }
                  setBusy();
                  var ret = scope.busyClick();
                  if (angular.isDefined(ret) && ret.hasOwnProperty('then')) {
                    ret.then(function () {
                        setNotBusy();
                    });
                  }

                });

            });

            var originalText = el.text();

            function setBusy(){
              scope.busy = true;
              el.addClass('busy')
              if(angular.isDefined(scope.busyText)){
                el.text(scope.busyText);
              }
            }

            function setNotBusy(){
              scope.busy = false;
              el.removeClass('busy')
              el.text(originalText);
            }
        }
    };
});
于 2013-10-29T07:25:59.670 回答
3

Angular 1.2中的某些指令优先级已更改（请参阅“重大更改”）。这是一个更新的 plunkr，它只是在angular-form-ui.js.

restrict: 'A',
priority: -100, // <-- This is the only change I made
controller: ...

这会导致替换ngClick属性值的指令在指令ngClick使用属性值创建函数指针$parse之前执行。

于 2013-10-29T04:25:21.610 回答