如何通過不同的視圖/頁面傳遞數據在angularJS上工作

Question

我正在學習angularJS，經歷了幾個教程，並知道我的原因。看起來頁面不會刷新，因此在一個視圖中創建的值應該在另一個視圖中可用，對吧？我正在商店場景中測試這個。如果我們在主視圖中，並且我們點擊應該在後臺觸發功能的「添加到購物車」並將該項添加到數組中。然後，當我們去購物車視圖，我們可以看到那裏列出的項目。但這不起作用。

我有一個車控制器：

angular.module('shoppingCartApp') 
    .controller('CartCtrl', function ($scope) { 
    $scope.cart = [ 
    'one item' 
    ]; 
    $scope.pushing = function(item){ 
     this.cart.push(item); 
    }; 
    }); 

在主視圖中（其不具有訪問該控制器）我有。

<div ng-controller="CartCtrl"> 
<a href="" ng-click="pushing('item 2')">add to chart</a> 
</div> 

而且對車查看我顯示cart對象

<div ng-repeat="item in cart"> 
    {{item}} 
</div> 

我們只看到了one item。我也在此頁面上添加了ng-click屬性，只是爲了測試，但它確實有效，但是，如果我們回家並回來，該項目就消失了。

從頁面永不重新加載的想法來看，推送的項目應該保留在數組中嗎？這裏是簡單example in action

感謝

Answer 1

Controllers不是單身，那麼當您更改視圖的$scope被摧毀，新的controller將被初始化。如果你想要在不同的視圖中保存持久數據，那麼你想看看使用service來存儲它，因爲它們是單身人士。

如果你創造這樣

angular.module('app') 
.service('cartService', [function() { 
    var cart = []; 
    var add = function(item) { 
     cart.push(item); 
    }; 
    var get = function() { 
     return cart; 
    }; 
    return { 
     add: add, 
     get: get 
    };  
}]); 

然後你就可以在你的controllers補充說，作爲一個依賴和使用，用於備份您的數據，而不是使用$scope。

angular.module('app') 
.controller('Ctrl', ['cartService', function(cartService) { 
    $scope.cart = cartService.get(); 

    $scope.pushing = function(item) { 
     cartService.add(item); 
    }; 
}]);