Javascript 烤面包机没有'；ajax返回成功后不会出现

一般来说，我对angularjs和web开发是新手。 我有一个ajax请求，它在单击按钮后向服务器发送一些信息。当请求返回success时，我想展示一个祝酒词，表明请求已成功发送。然而，toast永远不会弹出，但我有一个控制台日志，可以打印请求已发送。为什么吐司不爆

注意：当我尝试在ajax调用的success函数之外显示toast时，它确实起作用

提前谢谢

这是我的密码：

(function() {
    'use strict';

    angular
        .module('app.dashboard')
        .controller('NotificationController', NotificationController);

    NotificationController.$inject = ['$resource', '$http', '$state','toaster'];
    function NotificationController($resource, $http, $state, toaster) {
        var vm = this;

        activate();


        vm.alertSubmit  = function() {
            console.log(vm.subject);
            console.log(vm.htmlContent);

            const item = {

                'subject':vm.subject,
                'body': vm.htmlContent
            };

            //toaster.pop(vm.toaster.type, vm.toaster.title, vm.toaster.text); If I try this line the toast does appear.

            //console.log(item);
            //console.log(JSON.stringify(item));
            $.ajax({
                type: 'POST',
                accepts: 'application/json',
                url: 'api/pushnotification',
                contentType: 'application/json',
                data: JSON.stringify(item),
                error: function (jqXHR, textStatus, errorThrown) {
                    alert(errorThrown);
                    toaster.pop(vm.toaster.type, "Failure", "Message wasn't send.");
                },
                success: function (result) {
                    console.log(result);
                    toaster.pop(vm.toaster.type, vm.toaster.title, vm.toaster.text);
                }
            });
            return false;
        };

        function activate() {
          // the following allow to request array $resource instead of object (default)

            $http
                .get('api/auth')
                .then(function(response) {
                    // assumes if ok, response is an object with some data, if not, a string with error
                    // customize according to your api                
                    if (!response.data) {
                        $state.go('page.login');
                    }
                    else
                    {
                        var actions = {'get': {method: 'GET', isArray: true}};
                        vm.toaster = {
                            type: 'success',
                            title: 'Success',
                            text: 'Message was sent successfully.'
                        };

                        //vm.pop = function () {
                        //    toaster.pop(vm.toaster.type, vm.toaster.title, vm.toaster.text);
                        //};

                    }
                }, function() {
                    $state.go('page.login');
                });         
                console.log("activate func"); 
        }
    }
})();

---

正如@georgeawg正确建议的那样，您可以使用$http服务：

$http.post('/someUrl', data, config).then(successCallback, errorCallback);

并将代码修改为：

$http.post({
      'api/pushnotification', // Post URL
       JSON.stringify(item),  // Data to be sent
       contentType: 'application/json' // Header Config
}).then(
        // successCallback
        function (result) {
            console.log(result);
            toaster.pop(vm.toaster.type, vm.toaster.title, vm.toaster.text);
        },

        // errorCallback
        function (errorThrown) {
            alert(errorThrown);
            toaster.pop(vm.toaster.type, "Failure", "Message wasn't send.");
        },
);

而不是您的代码：

$.ajax({
            type: 'POST',
            accepts: 'application/json',
            url: 'api/pushnotification',
            contentType: 'application/json',
            data: JSON.stringify(item),
            error: function (jqXHR, textStatus, errorThrown) {
                alert(errorThrown);
                toaster.pop(vm.toaster.type, "Failure", "Message wasn't send.");
            },
            success: function (result) {
                console.log(result);
                toaster.pop(vm.toaster.type, vm.toaster.title, vm.toaster.text);
            }
        });

---

正如@georgeawg正确建议的那样，您可以使用$http服务：

$http.post('/someUrl', data, config).then(successCallback, errorCallback);

并将代码修改为：

$http.post({
      'api/pushnotification', // Post URL
       JSON.stringify(item),  // Data to be sent
       contentType: 'application/json' // Header Config
}).then(
        // successCallback
        function (result) {
            console.log(result);
            toaster.pop(vm.toaster.type, vm.toaster.title, vm.toaster.text);
        },

        // errorCallback
        function (errorThrown) {
            alert(errorThrown);
            toaster.pop(vm.toaster.type, "Failure", "Message wasn't send.");
        },
);

而不是您的代码：

$.ajax({
            type: 'POST',
            accepts: 'application/json',
            url: 'api/pushnotification',
            contentType: 'application/json',
            data: JSON.stringify(item),
            error: function (jqXHR, textStatus, errorThrown) {
                alert(errorThrown);
                toaster.pop(vm.toaster.type, "Failure", "Message wasn't send.");
            },
            success: function (result) {
                console.log(result);
                toaster.pop(vm.toaster.type, vm.toaster.title, vm.toaster.text);
            }
        });

---

jQueryAjax没有与AngularJS框架集成。而是使用集成的AngularJS$http服务。只有在AngularJS执行上下文中应用的操作才能受益于AngularJS数据绑定、异常处理、属性监视等。jQuery ajax未与AngularJS框架集成。而是使用集成的AngularJS$http服务。只有在AngularJS执行上下文中应用的操作才会受益于AngularJS数据绑定、异常处理、属性监视等。