CODEWITHSUNDEEP
angularjsionic-framework
Gunner
Gunner

Reputation: 15

Passing values between html files

I am making a shopping application in ionic/ angular JS. I want to pass a value (name of my subcategory) from my subcategory page to the detail page. Here is my code:

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>

Detail page:

<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>

Add to cart controller:

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

      var arr = [];

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

I need to pass the subcategory name from the subcategory page to detail page and to the add to cart controller. How can I do this?

Upvotes: 0

Views: 627

Answers (2)

Devidas Kadam
Devidas Kadam

Reputation: 944

you can send the subcategory value as URL Parameters, kindly refer this link

from this you have to create a state for detail page

for example

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

in your detailsCtrl controller you will get the value i.e product id, from this you can get the detail and show it to detail page

in controller

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

your view code for passing url parameters will be 

<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>

Upvotes: 1

XAVIER K.I
XAVIER K.I

Reputation: 349

you have to create a service in order get and set the data , like this 

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

And inject the service in your controller to get the subtitle

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

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

var subcategory_name = myService.getData();

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

Upvotes: 0

Related Questions