изменение текста на кнопке при сохранении с помощью 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";
};
При сохранении данных я хотел бы изменить текст с "Сохранить данные" на "Сохранение данных" и вернуться к "Сохранить данные", когда данные были сохранены.
ОБНОВИТЬ
я добавил
$scope.ButtonText = "Save day";
основываясь на ответах ниже, но понял, что мои потребности более сложны, так как я вызываю асинхронный сервис несколько раз. Поэтому я предполагаю, что вопрос заключается в том, как установить текст во время асинхронного вызова службы и вернуть его обратно к исходному тексту, в конце концов, вызовы службы завершены.
Спасибо
Томас
Ответы
Ответ 1
Вы можете открыть текст кнопки в области, а затем обновить значение области при сохранении:
<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";
}
});
}
};
Ответ 2
Есть, по крайней мере, несколько способов.
Один из способов - создать другое свойство в области, которое будет содержать текст кнопки.
$scope.buttonText = 'Save';
$scope.save = function() {
$scope.buttonText = 'Saving...';
};
Затем вместо текста кнопки жесткого кодирования в HTML привязывается к новому свойству scope.
<button ng-click="save()">{{buttonText}}</button>