Question

我想在任何用按钮替换按钮值的按钮上添加一个指令。然后以某种方式有一个函数，当我在我的代码中的任何地方调用该函数时（例如在ajax加载之后），它将恢复按钮的值。

我想知道如何在AngularJS中完成这项工作。

首先，我想我创建了一个指令......

.directive('spinnerButton', function () {
    return {
        restrict: 'A',

        link: function (scope, element, attrs) {
            element.bind('click', clickedButton);

            function clickedButton() {
               //get button change  add the words loading...
            }
        }
    }
});

在我的按钮上作为指令...

  <div ng-click="loadsomething()" spinner-button>All Projects</div>

然后以某种方式回想起说要回复的驱动力......

等

.then(function (objects) {
                        //remove loading message

                    },

Answer 1

您可以对指令和外部作用域共享的loading属性使用双向数据绑定。单击元素时，将loading设置为true。加载完成后，在外部范围内将loading设置为false（例如loadsomething）。

您可以使用移植来更改按钮显示的内容。

return {
    restrict: "A",
    transclude: true,
    template: "<div ng-transclude ng-hide=loading></div>"
        + "<img ng-show=loading src=throbber.gif>",
    scope: {loading: "=spinnerButton"},
    link: function (scope, elem) {
        elem.bind("click", function () { scope.loading = true; });
    }
};

<div ng-click="loadsomething()" spinner-button=loading>All Projects</div>

http://jsfiddle.net/Loq0sm5w/

如何附加按钮的值然后将其更改回来

1 个答案: