Question

解决方案可能很简单，但我无法解决。在第一个视图中单击锚标记后，只是尝试在控制器的下一个视图中显示数据。页面成功更改但数据显示。

//这是我的App.js

.config(function($stateProvider,$urlRouterProvider) {
  $stateProvider
  .state('Login',{
    url:'/Login',
    templateUrl:'templates/Login.html',
    controller:'SignInCtrl'

  })
.state('saledetailstable',{
    url:'/saledetailstable',
    templateUrl:'templates/saledetailstable.html',
    controller:'SignInCtrl'
  })

//这是我的第一个观点

<tr ng-repeat="item in saleitems">
       <td>{{item.id}}</td>
       <td>{{item.totalqnty}}</td>
       <td>{{item.totalprice}}</td>
      <td><a ng-click="additems()">{{item.inv_no}}</a></td>
       <td>{{item.inv_date}}</td>
       <td>{{item.sync_status}}</td>
       <td>{{item.device_Id}}</td>
       <td>{{item.U_id}}</td>
     </tr>

//这是我的控制器代码

$scope.additems = function ()
  {
      $scope.saledetailsitems=[{ id: '45', item: 'hello' }];


   $state.go('saledetailstable');
  }

//这是我的下一个观点

<tr ng-repeat="item in saledetailsitems">
       <td>{{item.id}}</td>
       <td>{{item.item}}</td>
     </tr>

Answer 1

这是如何做到这一点的一种可行方式，这在我看来是最干净的。它有点复杂，但我建议你试一试。

首先在路由配置中使用：var

配置可选参数

.config(function($stateProvider,$urlRouterProvider) {
  $stateProvider
  .state('Login',{
    url:'/Login',
    templateUrl:'templates/Login.html',
    controller:'SignInCtrl'

  })
.state('saledetailstable',{
    url:'/saledetailstable:id',
    templateUrl:'templates/saledetailstable.html',
    controller:'SignInCtrl'
  })

在此之后，在state.go中我们添加参数id，并在条目上检查stateParams

app.controller('SignInCtrl',
  function ($scope,$stateParams) {
   $scope.additems = function ()
   {
           $state.go('saledetailstable', {"id": 45);
   }
   //Check for the state params when the view changes 

 $scope.$on('$ionicView.enter', function () {
      if($stateParams.id){
            $scope.saledetailsitems=[{ id: '45', item: 'hello' }];
       }
    });
});

现在这是更简单的方式

app.controller('SignInCtrl',
  function ($rootScope,$scope) {
        if($rootScope.saledetailsitems)
         $scope.saledetailsitems = $rootScope.saledetailsitems;
       $scope.additems = function ()
      {
          $rootScope.saledetailsitems=[{ id: '45', item: 'hello' }];
          $state.go('saledetailstable');
      }
});

rootcope基本上是所有应用程序的最主要范围。它来自您创建应用程序时。因此，您可以存储在视图之间共享的内容。显然，这样做的缺点是它的内存效率低下而且草率

Answer 2

@ misha130＆＃39的答案应该有效。另一种定义参数的替代方法。

你可以使用＆＃34; params＆＃34; state config中的属性：

devtools

此语法非常新，您可以在此文档中找到它：http://angular-ui.github.io/ui-router/site/#/api/ui.router.state.$stateProvider。

此外，此票证很有用：How to pass parameters using ui-sref in ui-router to controller

顺便说一句，为了更清晰，我建议您使用不同的控制器来处理状态。

Answer 3

修改此行

<td><a ng-click="additems()">{{item.inv_no}}</a></td>

带

<td><a ng-click="additems(item)">{{item.inv_no}}</a></td>

并在下一个视图中传递item。

在下一页上，您可以获取item的数组并显示数据。

或

或者，您可以将其分配到$rootScope并在下一个视图中进行操作。

问候。

在页面中加载数据以离子形式加载

3 个答案: