Question

您好我有以下服务：

angular.module('vendor').service('ticketService', function() {

    var ticketList = [];
    var result = false;

    var addToCart = function(type, ticket, tSI) {
        var data = {}

        if (type =='event')
        {
            data = {
                type: type,
                tSI:  tSI
            }
        }

        if (type =='bus')
        {
            data = {
                type: type,
                company: ticket.company,
                date: ticket.when,
                number: ticket.number || 1,
                tSI:  tSI
            }
        }

        if (type == 'extra')
        {
            data = {
                type: type,
                extra: ticket,
                tSI:  tSI
            }
        }

        $.ajax({
            type: "post",
            url: '/cart',
            headers: {
                'X-XSRF-Token': $("meta[name='csrf_token']").attr("content")
            },
            data: data,
            dataType: 'json',
            success: function (data) {
                ticket.hasTicket = true;
                result = 200;
            }
        });
    }

    return {
        addToCart: addToCart,
        result: result
    };

});

现在我在我的控制器中调用此服务：

angular.module('vendor').controller('TicketController', ['$http', '$scope', '$rootScope', 'ticketService', '$timeout', function($http, $scope, $rootScope, ticketService, $timeout) {
    $scope.addToCart = function(type, ticket, tSI, $index) {
                $scope.selectedIndex = $index;

                $scope.isWorking = true;
                $scope.isReady = false;

                ticketService.addToCart(type, ticket, tSI);
                $rootScope.$broadcast('TICKET_ADDED', true);

            };

            $scope.$watch('ticketService.result', function (newVal, oldVal) {
                alert(ticketService.result);
                if (typeof newVal !== 'undefined') {
                    if (ticketService.result == 200) {
                        $scope.isWorking = false;
                        $scope.isComplete = true;
                    }
                }
            });
}]);

当添加故障单时，我希望能够在这种情况下将结果返回给控制器200，我当前正在尝试查看ticketService.result的值，但是当函数完成时，$ watch不会执行任何操作。

Answer 1

最好将ticketService.result分配给$scope属性并听取该属性。

使用，$scope.result = ticketService.result。

$scope.$watch('result', function (newVal, oldVal) {
                alert(ticketService.result);
                if (typeof newVal !== 'undefined') {
                    if (ticketService.result == 200) {
                        $scope.isWorking = false;
                        $scope.isComplete = true;
                    }
                }
            });

另一种选择是，

而不是从服务中创建$watch，emit事件，而是在您的范围内listen创建事件。

如下所示：

在您的服务中注入$rootScope。

$.ajax({
            type: "post",
            url: '/cart',
            headers: {
                'X-XSRF-Token': $("meta[name='csrf_token']").attr("content")
            },
            data: data,
            dataType: 'json',
            success: function (data) {
                ticket.hasTicket = true;
                result = 200;
                $rootScope.$emit("result-changed");
            }
        });

在你的控制器中，

$scope.$on("result-changed", function(event, data) {
    if (ticketService.result == 200) {
          $scope.isWorking = false;
          $scope.isComplete = true;
    }
});

这会减少您在申请中可能遇到的$watch个数。只有当事件触发时，控制器中的监听器才会触发。

Answer 2

尝试观看一个返回tickectService.result值而不是字符串的函数：

$scope.$watch(function() { return ticketService.result; }, function (newVal, oldVal) {
            alert(ticketService.result);
            if (typeof newVal !== 'undefined') {
                if (ticketService.result == 200) {
                    $scope.isWorking = false;
                    $scope.isComplete = true;
                }
            }
        });

$ scope。$ watch not working

2 个答案: