Question

有没有办法使用上一页的数据？

我有两页：＆＃39; / users＆＃39;和＆＃39; / users /：id＆＃39;

＆＃39; /用户＆＃39;模板：

<div ng-controller="userCtrl">
   <div ng=repeat="(k,v) from data">
      <span>{{v.name}}</span>
      <a ng-href="/users/{{k}}">View details</a>
   </div>
</div>

＆＃39; /用户/：ID＆＃39;页

<div ng-controller="userCtrl">
   <span>{{ data[currentId].name}}</span>

   <div>{{additional_data}}</div>
</div>




//Controller userCtrl
    $scope.currentId = $stateParams.id || false;
    $scope.data = {};

    $http.get('/users').then(function (response) {
        $scope.data = response;

        // returns
        // $scope.data[1] = {name: 'Alex'};
        // $scope.data[2] = {name: 'Masha'};
    }

    $scope.additional_data = 'Some data';

点击＆＃39;查看详细信息＆＃39;按钮我们将转到另一个页面与其他模板。但控制器是一样的。

有没有办法保存数据而不是再次呼叫请求？只需在新页面上呈现旧数据？

Answer 1

myApp.factory('CacheData', function{
  var scopeData=null;
  var setdata=function(data){
   scopeData=data;
  },
  var getdata=function(){
   return scopeData;
  }
});

//Controller file

 var data=CacheData.GetData(Data);
 if(data==null){
  //Write your code for getting data
  CacheData.SetData(Data); //set data for next call
 }

这里我创建了保存数据的服务。您可以使用 SetData 方法保存数据，并使用 Getdata 方法获取已保存的数据。

Answer 2

您可以查看服务。导航到网站的其他部分或刷新页面时，服务通常用于“保存”数据。

Here是有关服务的角度文档的链接。基本上，您将服务注入控制器，并从服务中的一个页面存储数据，然后在下一页上从服务获取数据并在该页面上使用它。

Answer 3

我建议您使用ui-router.

然后，您可以定义使用该控制器的父状态，并且两个子状态都可以访问控制器的同一个实例。

这样的事情：

这应该在配置块

中

  $stateProvider
    .state( 'users', {
      abstract : true,
      controller : // yourController,
      template : '<div ui-view></div>'
    })
      .state( 'users.list', {
        templateUrl : // whatever,
        url : '/users',
      })
      .state( 'users.detail', {
        templateUrl : // whatever,
        url : 'users/:id'
      });

ANgularJS使用上一页的数据

3 个答案: