Javascript 发布后更新angularJS中的$scope属性

首先，是的，我确实看了其他答案，但他们没有帮我

我目前正在开发一个基于angularJS的购物应用程序。在构建购物车、创建必要的功能并构建视图之后，我想通过创建无页面刷新来优化购物车，添加到购物车功能。因此，在对$scope.push和init load the cart函数等函数进行了一些尝试之后，我有点卡住了。购物车由以下代码生成：

获取购物车：

添加产品：

通过单击按钮，所有数据都从视图中获得，并传递到addToCart函数。我检查了所有东西，数据被插入。硬页面刷新后，新产品将添加到购物车中。但是我想删除硬页面刷新，并使用上面尝试过的方法：$scope.cartimes.pushrequest

更新

因此，在从评论中得到一些提示之后，我为购物车创建了一个服务。查看更新的代码：

马车服务

cartController和函数add

所以一切正常，我甚至可以在网络选项卡中看到新的getCart.php是用新数据获得的。遗憾的是，我的$scope和view没有更新

更新2

所以我看了一下这个例子，并为自己做了一些尝试。经过一些尝试，我得出了一个非常奇怪的结论：使用ng click refreshData操作通过以下函数刷新数据：

$scope.refreshData = function() {
    cartService.refreshData()
        .then(function(response) {
            $scope.cartItems = response.data.cartItems;
            $scope.totalCartItems = response.data;
            $scope.selectedCustomer = response.data;
        })
};

但是像第一个答案中的示例一样直接调用这个函数jsFiddle=>不会刷新视图和$scope

如果您有任何问题，请在评论中告诉我

PS：创建一个JSFIDLE会花费我很多时间，因为所有的数据都是通过

---

一如既往，提前感谢

似乎您使用了错误的方法。所有http调用都应该从服务中进行，而不是从控制器/组件中进行。 尝试为此创建服务。 不要忘记将服务注入控制器中。 所以毕竟会有这样的事情发生

例如：

$scope.cartItems = [];
$scope.getCartItems = function() {
cartService.getCartItems()
  .then(response => {
    $scope.cartItems  = response.data; // or response
  })
}

根据单据和添加方式注册服务

return {
  getCartItems: function() {
    return $http.get('config/cart/getCart.php', {cache: false})
  },
  // any other methods for http calls;
}

---

$http返回一个承诺。如果您想要从中获取数据，则需要解析它：$http…thenres=>{$scope.cartItems.pushres.data；}@AlekseySolovey$http{…}.thenfunctionresponse{$scope.cartItems.pushresponse.data.cartItems；}；返回：$scope.cartItems.push不是$scope.getCartItems之前调用的函数$scope.addToCart？因为它初始化数组$scope.cartItems=[]@AlekseySolovey是的，它在$scope.addToCart之前调用。您能分享一个完整的示例吗？感谢您提供完整的示例。因此，我创建了服务并将其添加到我的控制器中。一切顺利。这是一项伟大的技术。遗憾的是，$scope仍然没有更新。你能看一下问题的更新部分吗？更新是added@Deathstorm您应该有这样的东西，所有http调用都应该从服务中进行，即使是post调用。控制台返回带有ng click added数据的新购物车。直到我使用硬刷新，视图才会更新

myApp.controller('CartController', function($http, $scope, cartService) {
    $scope.getTheCart = function() {
        cartService.getCartItems()
            .then(function(response) {
                $scope.cartItems = response.data.cartItems;
                $scope.totalCartItems = response.data;
                $scope.selectedCustomer = response.data;
            })
    };

$scope.addToCart = function(product, stock_available) {
        var product_id = product.id;
        var product_name = product.name.language;
        var product_price = $('span[name="combinationTotalPrice' + stock_available.id + '"]').text();
        var product_size = $('span[name="product_attributes' + stock_available.id + '"]').text();
        var product_quantity = product.quantity;
        var product_id_attribute = stock_available.id_product_attribute;

        console.log(product_id_attribute);

        var request = $http({
            method: "post",
            url: "config/cart/getCart.php?action=addToCart",
            data: {
                product_id: product_id,
                product_name: product_name,
                product_price: product_price,
                product_size: product_size,
                product_quantity: product_quantity,
                product_id_attribute: product_id_attribute
            },
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded'
            }
        }).then(function() {
            $scope.getTheCart();
        });
    };
});

$scope.refreshData = function() {
    cartService.refreshData()
        .then(function(response) {
            $scope.cartItems = response.data.cartItems;
            $scope.totalCartItems = response.data;
            $scope.selectedCustomer = response.data;
        })
};

$scope.addToCart = function(product, stock_available) {
    return cartService.addToCart(product, stock_available)
        .then(function(response) {
        console.log(response);
            $scope.cartItems = response.data.cartItems;
            $scope.totalCartItems = response.data;
            $scope.selectedCustomer = response.data;
        // call the get() function
        $scope.refreshData();
    })
};

$scope.cartItems = [];
$scope.getCartItems = function() {
cartService.getCartItems()
  .then(response => {
    $scope.cartItems  = response.data; // or response
  })
}

return {
  getCartItems: function() {
    return $http.get('config/cart/getCart.php', {cache: false})
  },
  // any other methods for http calls;
}