2016-04-25 122 views
0

我正在離子/角JS中製作購物應用程序。我想從我的子類別頁面傳遞一個值(我的子類別的名稱)到詳細信息頁面。這裏是我的代碼:在html文件之間傳遞值

Subcategory.html

<div> 
<ion-view view-title="SubCategories"> 
<ion-list> 
<ion-item class="ionitems" ng-repeat="sublist in subCategories" href="#/app/playlists/{{sublist.id}}/details"> 
{{sublist.name}} 

<!--<a ng-click="godetails();">{{sublist.name}}<a/>--> 
</ion-item> 
</ion-list> 
</div> 

詳細信息頁面:

<ion-content> 
    <h4>Product Details</h4> 
    <ion-view view-title="playlists"> 
     <ion-content ng-controller="PlaylistCtrl"> 
     <input type="button" ng-click="addToCart();" value="add cart" /> 
     </ion-content> 

添加到購物車控制器:

.controller('detailsCtrl', function($scope){ 

     var arr = []; 

     $scope.addToCart = function() { 
     arr.push(""); 

我需要將子類別名稱從子類別頁面傳遞到詳細信息頁面並添加到購物車控制器。我怎樣才能做到這一點?

+0

它有很多方法可以做到這一點,使用$ rootScope,路由器PARAM等。 –

回答

1

,您可以發送的子類別值爲URL Parameters,請參閱this link

由此您必須創建一個state的詳細信息頁面

例如

.state('app.detail', { 
    url: "/product/:productId", 
    templateUrl: 'detail.html', 
    controller: 'detailsCtrl' 
}) 
detailsCtrl控制器

,您將獲得價值,即產品ID,從這個你可以得到的細節,展示給詳細信息頁面中控制器

.controller('detailsCtrl', function($scope,$stateParam){ 
    var productId = $stateParam.productId; 
    //now you get product id , get the detail and show on detail page 
    }); 

您傳遞網址參數的代碼爲

<ion-view view-title="SubCategories"> 
<ion-list> 
<ion-item class="ionitems" ng-repeat="sublist in subCategories"> 
<a ui-sref="detail({productId: sublist.productId})">{{sublist.name}}<a/> 
</ion-item> 
</ion-list> 

+0

與對象鍵 –

+0

這個工作取代的productId在視圖文件!謝謝。 – Gunner

0

你必須創建一個服務,才能獲取和設置數據,這樣

myApp.service('myService', function() { 
     var data = ""; 
     return { 
     getData: function() { 
      return data; 
     }, 
     setData: function(subcategoryName) { 
      data = subcategoryName; 
     } 
     }; 
    }); 

,並注入在控制器的服務來獲得字幕

.controller('detailsCtrl', function($scope,myService){ 

    var arr = []; 
// use myService to get the data 

var subcategory_name = myService.getData(); 

    $scope.addToCart = function() { 
    arr.push("");