2015-08-20 1 views
0

Я создаю приложение Angular mobile SPA, а часть требований содержит значительное количество списков >> подробных страниц. После того, как они будут фильтроваться, чтобы заполнить список, они могут щелкнуть по элементу, чтобы перейти на страницу сведений для него (с параметрами crud, если разрешено, что исключает использование модального кода). Я сохраняю соответствующие данные и вещи в службе, но это не помогает поддерживать положение прокрутки, а липкое состояние ui-router-extras похоже на то, что было бы идеально. Я также использую requirejs, если это имеет значение. Кроме того, я использую привязку списка Kendo ListView с источником kendo.data, если это имеет значение.Угловой ui-router со спа с использованием липких состояний, не сохраняющих положение прокрутки на первой кнопке назад

Я реализовал его, но я не уверен, что я сделал это правильно. Я прокручиваю вниз и нажимаю на элемент списка, и он переходит к деталям. Когда я нажимаю кнопку «Назад» (директива, которая использует $window.history.back();, хотя я попытался использовать $state.go, и он сделал то же самое), он вернется и будет использовать «кэшированную» версию, но будет в верхней части списка. Если я прокручу вниз и нажму на другой элемент, а затем вернусь, он будет поддерживать положение прокрутки, как я ожидаю.

Я включил $stickyStateProvider.enableDebug(true);, и результат выглядит идентичным с первого на последующие вызовы.

Вот мои состояния конфигурации:

return app.config(function ($stateProvider, $stickyStateProvider, $urlRouterProvider) { 
    $stickyStateProvider.enableDebug(true); 
    $urlRouterProvider.otherwise(function ($injector, $location) { 
     var $state = $injector.get("$state"); 
     $state.go("home"); 
    }); 
    $stateProvider.state('home', { 
     url: '/home', 
     templateUrl: 'app/views/home.html', 
     controller: 'homeController', 
     controllerAs: "vm" 
    }) 
    .state('cmmenu', { 
     url: '/cmmenu', 
     templateUrl: 'app/views/cmmenu.html', 
     controller: 'cmmenuController', 
     controllerAs: "vm" 
    }) 
    .state('areainquiry', { 
     //sticky: true, 
     abstract: true, 
     url: '/areainquiry', 
     templateUrl: 'app/views/areainquiry.html' 
    }) 
    .state('areainquiry.list', { 
     url: '/areainquirylist', 
     views: { 
      '[email protected]': { 
       templateUrl: 'app/views/areainquirylist.html', 
       controller: 'areainquirylistController', 
       controllerAs: "vm" 
      } 
     }, 
     sticky: true, 
     deepStateRedirect: true 
    }) 
    .state('areainquiry.details', { 
     url: '/areainquirydetails/:areaInquiryId', 
     views: { 
      '[email protected]': { 
       templateUrl: 'app/views/areainquirydetails.html', 
       controller: 'areainquirydetailsController', 
       controllerAs: "vm" 
      } 
     } 
    }) 
    .state('login', { 
     url: '/login', 
     templateUrl: 'app/views/login.html', 
     controller: 'loginController', 
     controllerAs: "vm" 
    }); 
}) 

Вот areainquiry.html, что это абстрактный вид родителя:

<div ui-view="areainquirylist" ng-show="$state.includes('areainquiry.list')"></div> 
<div ui-view="areainquirydetails" ng-show="$state.includes('areainquiry.details')"></div> 

Вот код, который открывает этот экран. У меня нет именованного представления в моем index.html, и все представления до isainquiry.html используют корневой неименованный вид (я дал ему имя «тело» и изменил все их, чтобы использовать его, но он работал то же самое):

<div class="col-xs-6 col-md-4"> 
    <a class="btn btn-default fullwidth" ui-sref="areainquiry.list"> 
     <span class="{{ vm.areaInquiryButtonIcon }}"></span> 
     <br /> 
     {{ vm.areaInquiryButtonText }} 
    </a> 
</div> 

Я пытался выяснить способ сделать это без абстрактного состояния и только через родительский areainquiry и ребенка areainquiry.detail, но не мог заставить его работать именно так, поэтому пошел этот маршрут.

ответ

0

Ничего. Это работает. Я не уверен, как я это исправил. Я работал над другой проблемой (имел дело с заводской службой), поэтому я предполагаю, что это исправлено.