按钮更改文本在使用angularjs节约 [英] changing text on button while saving using angularjs

问题描述

我要如何改变一个提交按钮文本，而在形式保存数据？

How do I change the text on a submit-button while saving data in a form ?

我有这样一个按钮

<button ng-click="save()">Save data</button>

和我更新了基于下面的答案我保存功能：

and I updated my save-function based on the answers below:

    $scope.ButtonText = "Save day";
    $scope.save=function(){
        $scope.ButtonText = "Saving day";
        for(var i=0;i<days.length;i++)
        {
           MyService.saveday()
            .success(function(data, status, headers, config) {
            })
            .error(function(data, status, headers, config) {
            });
        }
       $scope.ButtonText = "Save day";
    };

保存数据，我想改变从保存数据，以保存数据文本，并返回到保存数据当数据已保存。

While saving data, I would like to change the text from "Save data" to "Saving data" and back to "Save data" when the data has been saved.

更新的

UPDATE

我添加

 $scope.ButtonText = "Save day"; 

根据下面的答案，但意识到我需要更复杂，因为我调用一个异步服务多次。所以我想这个问题是我怎么可以设置文本，而服务被异步调用，只将其恢复为原始文本，之后该服务的所有调用执行完毕。

based on the answers below, but realised that my needs are more complex, since I am calling an asynchronous service multiple times. So I guess the question is how I can set the text while the service is being called asynchronously and only revert it back to the original text, after all calls to the service have finished executing.

感谢

托马斯

推荐答案

您可以在公开的范围的按钮上的文字，然后更新的范围值，同时节省了：

You can expose the button text in the scope, and then update the scope value while saving:

<button ng-click="save()">{{button}}</button>

和你的功能：

$scope.button = "Save data";

$scope.save=function(){
    $scope.button = "Saving day";
    for(var i=0;i<days.length;i++)
    {
       MyService.saveday()
        .success(function(data, status, headers, config) {
        })
        .error(function(data, status, headers, config) {
        }).then(function() {
            if (i===days.length) { // is the last iteration
                $scope.button = "Save day";
            }
        });
    }

};

这篇关于按钮更改文本在使用angularjs节约的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！