将项添加到购物车指令表单控制器

时间:2015-04-19 20:13:38

标签: angularjs angularjs-directive

我的控制器中有以下功能:

$scope.items = [];

$scope.addToCart = function(data, $index) {

    ticketService.addToCart(data, $index)
        .success(function(data, status, headers, config) {
            var item = {
                ticket_id: $scope.eventInfo.id,
                ticket_no: $scope.ticketTypes[0].ticket_no,
                ticket_type: 'event',
                ticket_desc: $scope.eventInfo.event_name,
                ticket_class: $scope.ticketTypes[0].fee_cat_desc,
                ticket_price: $scope.ticketTypes[0].event_fee,
                ticket_date: $scope.eventInfo.event_date,
                ticket_time: $scope.eventInfo.event_time,
                ticket_venue: $scope.eventInfo.event_venue,
                ticket_key: data.responseData
            }

            $scope.items.push(item);
        })
        .error(function(data, status, headers, config) {
            // called asynchronously if an error occurs
            // or server returns response with an error status.
            //alert(data);
        });
}

这是我的服务:

angular.module('vendor').service('ticketService', ['$http', '$rootScope', function($http, $rootScope) {
    var addToCart = function(data, $index) {
        var req = {
            method: 'POST',
            url: '/api/v1/cart',
            headers: {
                'X-XSRF-Token': $("meta[name='csrf_token']").attr("content")
            },
            data: data,
            cache: true
        }

        return $http(req)
    }

    return {
        addToCart: addToCart
    };

}]);

现在,当用户点击按钮时,它会执行此操作" addToCart"函数,函数将数据发布到服务器,如果数据处理成功,则返回true。现在我想将发布到服务器的数据添加到我的购物车指令中,我一直在尝试,但没有结果。

推完我的"项目"对象我的对象数组我希望它显示在我的购物车指令中。 这是我的购物车指令:

(function() {

    angular.module('vendor').directive('cart', ['$http', '$timeout', 'ticketService', function($http, $timeout, ticketService) {
        return {
            restrict: 'E',
            scope: {
                items: '@'
            },
            templateUrl: '/js/app/templates/cart.html',
            link: function($scope, $element, $attrs) {
                $scope.d = {};
                $scope.d.tickets = {};
                $scope.d.extras = {};

            },
            controllerAs: 'cart'
        }
    }]);

}) ();

1 个答案:

答案 0 :(得分:2)

如果你真的不需要指令上的隔离/本地范围,那么只需删除它,指令将继承控制器范围,从而使指令可以访问items