mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2026-03-13 10:22:08 +08:00
fix(cache): do not cache view after history change
If a view is set to not be cached, and it is the first view that was loaded, and the next navigation was to a different history with its own ion-nav-views (tabs), then remove the first view. Also allow for the cache state property to be a string ‘false’ and boolean false.
This commit is contained in:
21
js/angular/controller/navViewController.js
vendored
21
js/angular/controller/navViewController.js
vendored
@@ -13,6 +13,7 @@ function($scope, $element, $attrs, $compile, $controller, $ionicNavBarDelegate,
|
||||
|
||||
var DATA_ELE_IDENTIFIER = '$eleId';
|
||||
var DATA_DESTROY_ELE = '$destroyEle';
|
||||
var DATA_NO_CACHE = '$noCache';
|
||||
var VIEW_STATUS_ACTIVE = 'active';
|
||||
var VIEW_STATUS_CACHED = 'cached';
|
||||
var HISTORY_AFTER_ROOT = 'after-root';
|
||||
@@ -132,11 +133,10 @@ function($scope, $element, $attrs, $compile, $controller, $ionicNavBarDelegate,
|
||||
|
||||
self.transitionEnd = function() {
|
||||
var viewElements = $element.children();
|
||||
var viewElementsLength = viewElements.length;
|
||||
var x, viewElement;
|
||||
var x, l, viewElement;
|
||||
var isHistoryRoot;
|
||||
|
||||
for (x = 0; x < viewElementsLength; x++) {
|
||||
for (x = 0, l = viewElements.length; x < l; x++) {
|
||||
viewElement = viewElements.eq(x);
|
||||
|
||||
if (viewElement.data(DATA_ELE_IDENTIFIER) === activeEleId) {
|
||||
@@ -144,14 +144,21 @@ function($scope, $element, $attrs, $compile, $controller, $ionicNavBarDelegate,
|
||||
navViewAttr(viewElement, VIEW_STATUS_ACTIVE);
|
||||
isHistoryRoot = $ionicViewSwitcher.isHistoryRoot(viewElement);
|
||||
|
||||
} else if (navViewAttr(viewElement) === 'leaving' || navViewAttr(viewElement) === VIEW_STATUS_ACTIVE) {
|
||||
// this is a leaving element or was the former active element
|
||||
navViewAttr(viewElement, VIEW_STATUS_CACHED);
|
||||
} else if (navViewAttr(viewElement) === 'leaving' || navViewAttr(viewElement) === VIEW_STATUS_ACTIVE || navViewAttr(viewElement) === VIEW_STATUS_CACHED) {
|
||||
// this is a leaving element or was the former active element, or is an cached element
|
||||
if (viewElement.data(DATA_DESTROY_ELE) || viewElement.data(DATA_NO_CACHE)) {
|
||||
// this element shouldn't stay cached
|
||||
$ionicViewSwitcher.destroyViewEle(viewElement);
|
||||
} else {
|
||||
// keep in the DOM, mark as cached
|
||||
navViewAttr(viewElement, VIEW_STATUS_CACHED);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (isHistoryRoot) {
|
||||
for (x = 0; x < viewElementsLength; x++) {
|
||||
viewElements = $element.children();
|
||||
for (x = 0, l = viewElements.length; x < l; x++) {
|
||||
viewElement = viewElements.eq(x);
|
||||
|
||||
if ($ionicViewSwitcher.isHistoryRoot(viewElement) && navViewAttr(viewElement) !== VIEW_STATUS_ACTIVE) {
|
||||
|
||||
2
js/angular/service/viewSwitcher.js
vendored
2
js/angular/service/viewSwitcher.js
vendored
@@ -184,7 +184,7 @@ function($timeout, $document, $q, $ionicClickBlock, $ionicConfig, $ionicNavBarDe
|
||||
|
||||
// if the current state has cache:false
|
||||
// or the element has cache-view="false" attribute
|
||||
if (viewState(viewLocals).cache === false || enteringEle.attr('cache-view') == 'false') {
|
||||
if (viewState(viewLocals).cache === false || viewState(viewLocals).cache === 'false' || enteringEle.attr('cache-view') == 'false') {
|
||||
enteringEle.data(DATA_NO_CACHE, true);
|
||||
}
|
||||
|
||||
|
||||
@@ -103,6 +103,14 @@ describe('Ionic nav-view', function() {
|
||||
template: '<ion-view>ionViewCacheFalsePropertyState</ion-view>',
|
||||
cache: false
|
||||
},
|
||||
rootView1State = {
|
||||
cache: 'false',
|
||||
views: {
|
||||
'root': {
|
||||
template: '<ion-view>rootView1State</ion-view>'
|
||||
}
|
||||
}
|
||||
},
|
||||
tabAbstractState = {
|
||||
abstract: true,
|
||||
views: {
|
||||
@@ -174,7 +182,8 @@ describe('Ionic nav-view', function() {
|
||||
.state('tabAbstract.tab1page1', tab1page1State)
|
||||
.state('tabAbstract.tab2page1', tab2page1State)
|
||||
.state('tabAbstract.tab3page1', tab3page1State)
|
||||
.state('tabAbstract.tab3page2', tab3page2NoCacheState);
|
||||
.state('tabAbstract.tab3page2', tab3page2NoCacheState)
|
||||
.state('rootView1', rootView1State);
|
||||
}));
|
||||
|
||||
beforeEach(inject(function(_$compile_, $ionicConfig, $rootScope) {
|
||||
@@ -932,6 +941,25 @@ describe('Ionic nav-view', function() {
|
||||
expect(tab3Ele.getAttribute('nav-view')).toBe('cached');
|
||||
}));
|
||||
|
||||
it('should not cache ion-views when going between history and its the first load', inject(function ($state, $q, $timeout, $compile, $ionicConfig) {
|
||||
elem.append($compile('<ion-nav-view name="root"></ion-nav-view>')(scope));
|
||||
|
||||
$state.go(rootView1State);
|
||||
$q.flush();
|
||||
$timeout.flush();
|
||||
expect(elem.find('ion-nav-view').find('ion-view').length).toBe(1);
|
||||
expect(elem.find('ion-nav-view').find('ion-view').eq(0).text()).toBe('rootView1State');
|
||||
|
||||
$state.go(tab1page1State);
|
||||
$q.flush();
|
||||
$timeout.flush();
|
||||
|
||||
var tab1Ele = elem[0].querySelector('ion-nav-view[name="tab1"]');
|
||||
expect(tab1Ele.getAttribute('nav-view')).toBe('active');
|
||||
|
||||
expect(elem[0].querySelector('ion-nav-view[name="root"]').children.length).toBe(1);
|
||||
}));
|
||||
|
||||
it('should not cache a tab with cache false state property', inject(function ($state, $q, $timeout, $compile, $ionicConfig) {
|
||||
elem.append($compile('<ion-nav-view name="root"></ion-nav-view>')(scope));
|
||||
|
||||
|
||||
Reference in New Issue
Block a user