我如何在 ionic v-1 中的两个页面之间共享值

Question

我正在尝试在选择时添加两个页面的值。它在各个页面上添加。但是，当我转到下一页时，总值变为零。我正在尝试将传递总附加值从一页添加到另一页。当我搜索时，我发现需要创建一个服务控制器来调用全局范围值。

<!-- page one view page -->

<ion-content class="search-main padding">
    <div class="list card">
 <div class="item item-body no-padding stable">
  <div class="row no-padding border-bottom" ng-controller="Ctrl3">
  <div class="col padding border-right" ng-click="openDateCheckIn()">
   <div class="margin-bottom-10" style="color:#0c60ee;"><i class="icon icon-money"></i> Total Value =></div>
  </div>
        <div class="col padding"><h2 style="text-align:center; margin-top: 3px;">Rs. &nbsp; <b>{{rootSum()}}</b></h2></div>
  </div>ass="col padding"><h2 style="text-align:center; margin-top: 3px;">Rs. &nbsp; {{rootSum()}}</h2></div>
  </div>
 <div ng-controller="Ctrl1">   
<div ng-repeat="gender in genders">
    <div class="row row-no-padding no-margin padding-important" style="color: #000;">
            <div class="col col-70"><i class="ion ion-ios-circle-filled"></i> <span>&nbsp;{{gender.id}}</span></div>
            <div class="col col-20"><span>Rs {{gender.value}}</span></div>
        <div class="col col-10"><div><label class="search-checkbox item item-checkbox" style="margin: -5px 0px 0px -2px;"><div class="checkbox checkbox-input-hidden disable-pointer-events checkbox-circle"><input id="{{gender}}" type="checkbox" value="{{gender.value}}" ng-checked="selection.indexOf(gender) > -1" ng-click="toggleSelection(gender)" /><i class="checkbox-icon"></i></div><div class="item-content disable-pointer-events" ng-transclude=""></div></label></div>
        </div></div>
     </div></div>

</ion-content>

<!-- Page two view page -->

<ion-content class="search-main padding">
    <div class="list card">
 <div class="item item-body no-padding stable">
  <div class="row no-padding border-bottom" ng-controller="Ctrl3">
  <div class="col padding border-right" ng-click="openDateCheckIn()">
   <div class="margin-bottom-10" style="color:#0c60ee;"><i class="icon icon-money"></i> Total Value =></div>
  </div>
        <div class="col padding"><h2 style="text-align:center; margin-top: 3px;">Rs. &nbsp; <b>{{rootSum()}}</b></h2></div>
  </div>
 <div ng-controller="Ctrl2">   
<div ng-repeat="gender in genders">
    <div class="row row-no-padding no-margin padding-important" style="color: #000;">
            <div class="col col-70"><i class="ion ion-ios-circle-filled"></i> <span>&nbsp;{{gender.id}}</span></div>
            <div class="col col-20"><span>Rs {{gender.value}}</span></div>
        <div class="col col-10"><div><label class="search-checkbox item item-checkbox" style="margin: -5px 0px 0px -2px;"><div class="checkbox checkbox-input-hidden disable-pointer-events checkbox-circle"><input id="{{gender}}" type="checkbox" value="{{gender.value}}" ng-checked="selection.indexOf(gender) > -1" ng-click="toggleSelection(gender)" /><i class="checkbox-icon"></i></div><div class="item-content disable-pointer-events" ng-transclude=""></div></label></div>
        </div></div>
     </div></div>
        
</div>
</div> 

</ion-content>

控制器页面--

//Ladies Makeup Party
.controller('Ctrl1', function($scope ,$rootScope) {
    $scope.genders=[{
    'id':'Krylon Party Makeup', 'value':2000 },
    {'id':'Makeup Studio', 'value':2200 },
    {'id':'Party Makeup(MAC)', 'value':2500 },
    {'id':'Party Mackeup(Airbrush)', 'value':3500 }     
    ];
      $rootScope.selection=[];
      $scope.toggleSelection = function toggleSelection(gender) {
        var idx = $scope.selection.indexOf(gender);
        if (idx > -1) {
          $scope.selection.splice(idx, 1);
         }
         else {
           $scope.selection.push(gender);        
         }
      };
    })

//Ladies Makeup Pre-bridal
.controller('Ctrl2', function($scope ,$rootScope) {
    $scope.genders=[{
    'id':'Silver', 'value':10000 },
    {'id':'Gold', 'value':12000 },
    {'id':'Platinum', 'value':16000 }                
    ];
      $rootScope.selection=[];
      $scope.toggleSelection = function toggleSelection(gender) {
        var idx = $scope.selection.indexOf(gender);
        if (idx > -1) {
          $scope.selection.splice(idx, 1);
         }
         else {
           $scope.selection.push(gender);        
         }
      };
    })

// Add total value on select
 .controller('Ctrl3', function($scope ,$rootScope) {
    
   $rootScope.rootSum=function(){
        var total=0;
        for(var i = 0; i < $rootScope.selection.length; i++){
        var product = $rootScope.selection[i];
        total += (product.value);
    }
    return total
      }; 

    }) *

Answer 1

这里有两个问题。

您正在每个控制器上初始化 $rootScope.selection = []，这会删除所有以前的更改。在运行 block.Use 这个 link 内的页面加载开始时初始化它以实现运行 run.

myApp.run(function() { console.log("app run"); });

您没有将所选数据传输到 $rootScope.selection 变量。您需要在 rootScope 中附加您选择的产品，并确保没有重复的项目。我建议您使用带有 'ids' 的对象作为属性名称，而不是数组，这将确保不会固有地重复任何项目。

我如何在 ionic v-1 中的两个页面之间共享值

How I can share the value between two pages in ionic v-1

hybrid

angularjs

ionic-framework