programing

Angularjs를 사용하여 저장하는 동안 버튼의 텍스트 변경

skycolor 2023. 10. 14. 09:59
반응형

Angularjs를 사용하여 저장하는 동안 버튼의 텍스트 변경

양식에 데이터를 저장하면서 제출 버튼의 텍스트를 변경하려면 어떻게 해야 합니까?

이런 버튼이 있습니다.

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

그리고 아래 답변을 토대로 저장 기능을 업데이트했습니다.

    $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";
    };

데이터를 저장하는 동안 텍스트를 "Save data"에서 "Save data"로 변경하고 데이터가 저장되면 다시 "Save data"로 변경하고자 합니다.

갱신하다

추가했습니다.

 $scope.ButtonText = "Save day"; 

아래 답변을 토대로 하지만, 비동기식 서비스를 여러 번 호출하기 때문에 제 요구가 더 복잡하다는 것을 깨달았습니다.따라서 문제는 서비스가 비동기적으로 호출되는 동안 텍스트를 설정하고 원래 텍스트로 되돌리기만 하면 결국 서비스에 대한 호출이 실행을 완료하는 방법인 것 같습니다.

감사해요.

토마스.

스코프에서 버튼 텍스트를 노출한 다음 다음 다음을 저장하면서 스코프 값을 업데이트할 수 있습니다.

<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";
            }
        });
    }

};

최소한 몇 가지 방법이 있습니다.

그 방법 중 하나는 스코프에 다른 속성을 만드는 것인데, 이 속성은 버튼의 텍스트를 저장합니다.

$scope.buttonText = 'Save';
$scope.save = function() {
    $scope.buttonText = 'Saving...';
};

그런 다음 HTML의 하드코딩 버튼 텍스트 대신 새 스코프 속성에 바인딩합니다.

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

언급URL : https://stackoverflow.com/questions/20646264/changing-text-on-button-while-saving-using-angularjs

반응형