2

我已经实现了一个应用程序,在其中显示结果列表,然后允许用户选择要比较的行并显示一些关于它们的额外数据。

我正在使用angular ui route,每个视图都有 2 个视图和 2 个控制器,所以我正在寻找将信息保存在第一个视图中的最佳方法(在此之前我有所有结果以进入比较视图)当用户回到第一个视图时。

到目前为止,我尝试过的是使用 a$localstorage但在第一个视图中,我有一个表单,用户可以在其中过滤搜索条件,而且我还有一些<select></select>通过ajax调用加载的表单,所以..$localstorage我保留了信息但没有设置表单详细信息,select input因为 ajax 调用尚未执行,并且我不想始终保留本地存储,仅在用户返回预览的情况下。

您可以在下面看到以下设置angular route ui

  .state('deposit', {
    url: '/deposit',
    templateUrl: './app/components/deposit/index.html',
    views: { "" : { templateUrl: './app/components/deposit/index.html' },
      "search@deposit": { templateUrl: "./app/components/deposit/search.html",
                            controller: "DepositSearchController"}
    }
  })
  .state('depositcomparison', {
    url: "/deposit/comparison",
    params: {
      ids: null,
      depositSearchData: null
    },
    templateUrl: './app/components/depositComparison/depositComparisonView.html',
    controller: 'DepositComparisonController'
  })

仅当我从比较视图返回结果视图时才保留数据的正确方法是什么?

有没有比这更好的方法localstorage

谢谢。

/********* 更新 ***********/ /*********** ajax 问题 ********* **/

获取选择的数据:

//...
$http.get(window.serviceUrl + '/api/institute').
  success(function(data){
    $scope.institutes = data.content;
    $scope.institutes.push({id: '0', name: 'All'});
    $localstorage.setObject('instituteData', $scope.institutes);
  }).
  error(function(data){
    console.log('Error');
  });
 //..

检查localstorage

//..
angular.element(document).ready(function () {
    if ($localstorage.getObject('instituteData').length !== 0) {
         $scope.institutes = $localstorage.getObject('instituteData');
      }
    //else call the ajax
//..
});

html:

<label for="forinstitute">Account Type</label>
<select id="instituteValue" class="form-control" ng-model="institute.id">
<option value=""> Select account</option>
<option ng-repeat="institute in institutes | orderBy:'name'" value="{{institute .id}}">{{institute .name}}</option>
</select>

/************************************************* *******/

可能是一个解决方案$watch

4

2 回答 2

1

您可以将要在 Angular 服务的视图中显示的任何数据存储起来。然后,您将该服务注入您的控制器。数据保留在服务中,因为 Angular 中的服务是单例的。

于 2015-05-21T17:20:55.790 回答
0

查看 ui router extras http://christopherthielen.github.io/ui-router-extras/#/sticky尝试使用粘滞状态,但请注意,当您返回该视图时,该视图上的控制器不会重新初始化。

示例用法,

$stateProvider
        //home state
         .state('home', {
            url: '/home',
            templateUrl: 'views/layout/home.html'
        })   
        //Client States
        .state('home.clients', {
            url: '/clients',
            views: {
                'clientTab@home':{
                 templateUrl: 'views/client/clients.html'
                 }
            },
             deepStateRedirect: true,
             sticky: true
           });
 $urlRouterProvider.otherwise('/');
于 2015-05-21T18:14:00.797 回答