向用户提供反馈的AngularJS问题
向用户提供反馈的AngularJS问题
提问于 2019-05-23 18:02:09
我有一个表单，当一个用户提交成功的东西时，他们会得到一个成功的消息！如果同一个用户提交错误，他们会得到错误信息。
但问题是:当用户获得成功消息时，即使他后来收到错误消息，屏幕上也总是存在成功消息。我的意思是，在同一时间，它显示了错误和成功的信息。
我希望当成功消息出现时，错误信息应该消失。
这是我的片段：
$http.post('http://127.0.0.1:8000/api/v1/contact/', $scope.formModel)
.then(function(response) {
$scope.successCallBack = 'You have successfully saved your contact';
}, function(response){
$scope.errorCallBack = 'an error occured'
});我希望你知道我的问题：
在这里，您将看到我如何在模板上使用此消息：
<div class="alert alert-success" ng-if="successCallBack">
<p> {{ successCallBack }} </p>
</div>
<div class="alert alert-danger" ng-if="errorCallBack">
<p> {{ errorCallBack }} </p>
</div> 我怎样才能解决这个问题？
回答 1
Stack Overflow用户
回答已采纳
发布于 2019-05-23 18:33:28
消息只需要一个布尔值和一个字符串：
$http.post('http://127.0.0.1:8000/api/v1/contact/', $scope.formModel)
.then(function(response) {
$scope.saveSuccess = true;
$scope.message = 'You have successfully saved your contact';
}, function(response){
$scope.saveSuccess = false;
$scope.message = 'an error occured';
});在模板中，可以使用ng-if：
<div class="alert alert-success" ng-if="saveSuccess">
<p> {{ message}} </p>
</div>
<div class="alert alert-danger" ng-if="!saveSuccess">
<p> {{ message}} </p>
</div> 或者你可以像这样简单地使用ng类：
<div ng-if="formSubmitted" class="alert" ng-class="{ 'alert-success': saveSuccess, 'alert-danger': !saveSuccess }">
<p> {{ message}} </p>
</div>编辑:您可能需要另一个布尔值，以便知道提交的表单何时显示成功或错误消息，类似于formSubmitted。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/56280688
复制相关文章
相似问题
腾讯云开发者
