如何在angularjs中創建一個全局變量？

我試圖開發一個購物車，我有產品列表，當用戶點擊每個產品的詳細信息時會顯示，我想要添加每個產品到全球地圖或用戶點擊添加到購物車按鈕時，如何我可以做到這一點嗎？如何在angularjs中創建一個全局變量？

更好地瞭解這裏是我的鏈接plunker：https://plnkr.co/edit/oo05d6H6AxuJGXBAUQvr?p=preview

這是我的個人資料頁面，在這裏我想向用戶提供與添加到購物車選項：

<!DOCTYPE html> 

<p>ItemName: {{itemName}}</p> 
<p> ItemPrice: {{itemPrice|currency}}</p> 
<p>ItemRating:{{itemRating}}</p> 
<img src="{{itemImage}}"> 
<p><input type = "submit" value = "Add to Cart" ng-click = "addProduct()"></p>

來源

2017-03-04 vennapusa

使用服務。 AngularJS服務是單身人士。全局變量是邪惡的。 –

嘗試this版本。

有一個cartService定義在這裏，並注入您的ItemCtrl。所有項目都存儲在cartService內的cart陣列中。

請注意，此功能一直運行，直到您刷新頁面。如果您想要堅持這個cart變量，以便在頁面刷新期間不會被擦除，您應該查看localStorage或$cookies。

來源

2017-03-04 17:51:13 eminlala

謝謝，我該如何顯示購物車中的物品以及運行代碼時圖像沒有顯示 – vennapusa

對不起，我編輯了Plunker鏈接以顯示圖像。爲了顯示購物車項目，您可以創建一個名爲'cartDetails.html'的新模板和一個控制器。在你的新控制器中，注入'cartService'並創建一個變量來獲取購物車物品，例如'var carItems = cartService.getCart（）;'。接下來，在您的'cartDetails.html'中，您可以使用'ng-repeat'顯示您的購物車商品。 – eminlala

嗨，我試圖做你自己的方式，你可以說我要去哪裏錯在這個代碼-https：//plnkr.co/edit/oo05d6H6AxuJGXBAUQvr？p =預覽 – vennapusa

在你的情況下，一個簡單的地方可以在主控制器中存儲購物車，因爲它可以從嵌套視圖的子控制器訪問。因此，這裏是addProduct()功能如何實現：

app.controller('mobileController', function($scope) { 
    $scope.items = ... 

    $scope.cart = []; 

    $scope.addProduct = function(item) { 
    $scope.cart.push(item); 
    } 
});

等功能可以從產品細節控制器被調用，只要你允許它進入觀看item：

<input type= "submit" value="Add to Cart" ng-click="addProduct(item)">

由於那麼您可以在主控制器視圖中顯示更新的購物車（或在其子視圖中，因爲它仍然可以訪問）：

<div ng-repeat="item in cart track by item.name"> 
    <li>{{item.name}}</li> 
</div>

如果您想要多次添加相同的商品，則必須顯示訂單（或產品序列號）而不是產品。

找到分叉擒縱機構here。

P.S .:另一種選擇是將購物車存儲在一個Angular服務中，該服務將被注入任何需要它的控制器中。

PPS：我一直在使用$scope像你一樣，但你應該更新代碼到最新角用途，如使用controllerAs語法和使用控制器類，可以參考this（並在控制器的名稱前綴而不是。

來源

2017-03-04 17:53:24 Javarome

如何在angularjs中創建一個全局變量？

回答

相關問題