javascript - 当我进入另一个 ionic 状态时，数据不显示

Question

大家好，我遇到了一个问题。我将一些数据保存在 $scope.somevariable 中，然后转到另一个状态。我面临的问题是，当我进入另一个状态时，我看不到数据，而是看到我试图渲染的 View ，即

<ion-view view-title="ShowUserList">
  <ion-content>
    <!-- <ion-checkbox ng-model='checkStatus1' ng-click="showAlert(checkStatus1)">
        <h2 class="ng-binding">{{tittle}}</h2>
        <span class="distance ng-binding"></span>
        <h3 class="ng-binding">Created : {{created}}</h3>
        <h3 class="ng-binding">Target : {{targetD}}</h3>
    </ion-checkbox>  -->

    <ion-list>
      <ion-item  collection-repeat="user in users">
        Hello, {{user}}!
      </ion-item>
    </ion-list>


  </ion-content>
</ion-view>

这是我尝试渲染的 Controller

.controller('optionActionCtrl' , function($scope, $timeout , $http , $ionicModal , $state){
    // Triggered in the login modal to close it


  $scope.closeActionModal = function() {
    console.log('hello');
    $scope.modal.hide();
  };

  // Open the login modal
  $scope.openAddActionModel = function() {
    $scope.modal.show();
    // $('#action_datePicker').val(new Date());
  };

  $scope.showListOfUser = function(){
    //call made to the server

    // add all the users 
    $scope.users = ['a' , 'b' , 'c' , 'd'];

    $state.go('app.UserListForAssigned')
  };
})

这是我想要去的状态

.state('app.UserListForAssigned', {
      url: '/userList',
      views: {
        'menuContent': {
          templateUrl: 'templates/showUsers.html',
          controller: 'optionActionCtrl'
        },
      }
    })

之前的状态

 .state('app.options', {
      url: '/options',
      views: {
        'menuContent': {
          templateUrl: 'templates/options.html',
          controller: 'optionActionCtrl'
        },
      }
    })

Answer 1

如果您想传递整个用户列表或仅传递 1 个选定的用户，则此方法有效。

我假设在您之前的状态下，您单击一个按钮来调用 showListOfUser。之后您可以进行相应调整。

之前的状态:

应用程序

   .state('app.options', {
          url: '/options',
          views: {
            'menuContent': {
              templateUrl: 'templates/options.html',
              controller: 'optionActionCtrl'
            },
          }
        })

Controller

.controller('optionActionCtrl' , function($scope, $timeout , $http , $ionicModal , $state){
    // Triggered in the login modal to close it


  $scope.closeActionModal = function() {
    console.log('hello');
    $scope.modal.hide();
  };

  // Open the login modal
  $scope.openAddActionModel = function() {
    $scope.modal.show();
    // $('#action_datePicker').val(new Date());
  };

  $scope.showListOfUser = function(){
    //call made to the server

    // add all the users 
    $scope.users = ['a' , 'b' , 'c' , 'd'];
  };
})

HTML

  <a class="button" ng-click="showListOfUser()" ng-href="#/userList/{{users}}">click</a>

新状态:

应用程序

.state('app.UserListForAssigned', {
      url: '/userList/:userID',
      views: {
        'menuContent': {
          templateUrl: 'templates/showUsers.html',
          controller: 'UserListCtrl'
        },
      }
    })

Controller (创建单独的 Controller )

.controller('UserListCtrl', function($scope, $stateParams) {
    console.log('userID: ' + $stateParams.userID);

    $scope.users = $stateparams.userID;

});

我没有使用 $state.go()，而是通过 ng-href 传递 $scope.users 并通过 $stateParams。在 .state('app.UserListForAssigned', ...) 下，必须定义 url 以接收参数。