Javascript 更改POST AngularJS上的按钮样式

Javascript 更改POST AngularJS上的按钮样式,javascript,html,css,angularjs,post,Javascript,Html,Css,Angularjs,Post,我有一个联系人表单,在提交时,它会将帖子发送到后端文件: <div class="field text-center"> <button type="submit" class="submit form-btn" ng-disabled="contactForm.$invalid">Send</button> </div> 我想在函数成功发布和出现错误时更改按钮的颜色和文本。我的猜测是,在成功和错误回调函数中,我必须更新DOM,但

我有一个联系人表单,在提交时,它会将帖子发送到后端文件:

<div class="field text-center">
        <button type="submit" class="submit form-btn" ng-disabled="contactForm.$invalid">Send</button>
</div>
我想在函数成功发布和出现错误时更改按钮的颜色和文本。我的猜测是,在成功和错误回调函数中,我必须更新DOM,但我该怎么做呢?或者有更好/更简单的方法吗?

您可以使用它来更改控制器中DOM元素的样式

HTML:


如果你对这个答案有任何疑问,请告诉我

您希望在成功后还是在调用函数时执行此操作?请查看。ngStyle允许您将样式值从控制器传递到视图。您可以在成功或错误函数中使用jQuery作为$('.field button').css('background-color','red');
$scope.processForm = function() {
        $http({
            method  : 'POST',
            url     : '/php/contact.php',
            data    : $.param($scope.contactData),  // pass in data as strings
            headers : { 'Content-Type': 'application/x-www-form-urlencoded' }  // set the headers so angular passing info as form data (not request payload)
        }).then(function successCallback(response) {

        }, function errorCallback(response) {

        });
}
<div class="field text-center">
    <button ng-style="httpCall" type="submit" class="submit form-btn" ng-disabled="contactForm.$invalid">{{httpCallText}}</button>
</div>
$scope.processForm = function() {
    $http({
        method  : 'POST',
        url     : '/php/contact.php',
        data    : $.param($scope.contactData),  // pass in data as strings
        headers : { 'Content-Type': 'application/x-www-form-urlencoded' }  // set the headers so angular passing info as form data (not request payload)
    }).then(function successCallback(response) {
        var buttonColor = "green";
        $scope.httpCallText = "Success";
        $scope.httpCall = {
          'background-color': buttonColor
        }
    }, function errorCallback(response) {
        var buttonColor = "red";
        $scope.httpCallText = "Error";
        $scope.httpCall = {
          'background-color': buttonColor
        }
    });
}