【问题标题】:angular.js ui-router pass no dataangular.js ui-router 不传递数据
【发布时间】:2015-11-26 06:51:03
【问题描述】:

在我的 Ionic 应用程序 中,我想将参数从一个子视图传递到另一个子视图。当我第一次传递参数时,它按预期工作,但我的问题是,当我返回第一个子视图然后转到另一个子视图时,它会进入没有参数的页面。我的代码如下:

index.html(项目/www)

<!DOCTYPE html>
<html>
    <head>
       <link href="lib/ionic/css/ionic.css" rel="stylesheet">
       <script src="lib/ionic/js/ionic.bundle.js"></script>
       <script src="lib/ngCordova/dist/ng-cordova.js"></script> 
       <script src="cordova.js"></script>
       <script src="js/app.js"></script>
       <script src="js/main.js"></script>
       <script src="js/routes.js"></script>
   </head>
    <body ng-app="app" animation="slide-left-right-ios7" >
        <!-- main window -->
        <div>
            <ion-nav-view></ion-nav-view>
        </div>
    </body>

</html>

route.js (www/js/route.js)

angular.module('app.routes', [])
  .config(function($stateProvider, $urlRouterProvider) {
     $stateProvider
        .state('mainUser', {   // first window
           url: '/mainuser',
           templateUrl: 'templates/mainUser.html',
           controller: 'mainCtrl'
        })
       .state('userDrive', {  // second window
          url: '/user_drive',
          params: {
             driveData: null  // parameter send
          },
          templateUrl: 'templates/user_drive.html',
          controller: 'DriveCtrl'
    });
    $urlRouterProvider.otherwise('/mainUser');
 });

templates/mainUser.html

 <ion-side-menus>
    <ion-side-menu-content> 
        <ion-content class="padding" style="background-color:#fff;">        
            <input type="date" ng-model="selectData.selectedDate" placeholder="Date">

            <input type="time" ng-model="selectData.selectedTime" placeholder="Time">
         </ion-content>
         <div class="bar bar-footer">
             <div class="button-bar">
                 <a ui-sref="userDrive({ driveData: selectData })" class="button"> Drive </a> 
            </div>
         </div> 
     </ion-side-menu-content>
  </ion-side-menus>

这里点击Drive按钮后,会正确重定向到userDrive子视图,参数driveData。但是我回到mainUser,然后更改selectData.selectedDateselectData.selectedTime,然后再次单击Drive 按钮,它将重定向到userDrive 没有driveData 参数的子视图。

userDrive控制器

.controller('DriveCtrl', function($scope, $state, $stateParams) {       
     console.log("DriveCtrl");  // after redirect to this controller second time
                                // it also print no value
                                // seems might be DriveCtrl is not called
     console.log("$stateParams :  ", $stateParams);       
})

【问题讨论】:

    标签: javascript angularjs ionic-framework angular-ui-router


    【解决方案1】:

    问题是视图被 Ionic 缓存,在这种情况下控制器只执行一次,所以这就是为什么你只能在第一次看到日志。

    您需要使用离子视图事件,这里是文档:http://ionicframework.com/docs/api/directive/ionView/

    【讨论】:

      【解决方案2】:

      @leandro-zubrezki 是对的。要删除缓存,您可以在控制器“DriveCtrl”中的任何位置添加。

      $scope.$on("$ionicView.afterLeave", function () {
          $ionicHistory.clearCache();
      });
      

      【讨论】:

      • 你不应该删除缓存,你应该使用视图生命周期。
      • 但是为什么我们不应该删除缓存呢?你能告诉更多
      【解决方案3】:

      如果你需要单独发送每个值,你不能将对象发送到状态参数中

      【讨论】:

      • 但是我将对象发送到状态参数,我认为它有效
      猜你喜欢
      • 2016-12-12
      • 1970-01-01
      • 1970-01-01
      • 2015-08-31
      • 1970-01-01
      • 2017-04-10
      • 2015-01-20
      • 2021-04-16
      • 1970-01-01
      相关资源
      最近更新 更多