Контроллер инициализируется только один раз, даже если изменено `$stateparams`

Недавно я начал работать с Ionic Framework (и, следовательно, с Angular.js) и столкнулся с проблемой с Angular UI Router: одно из зарегистрированных состояний не переинициализируется, когда одно из его $stateParams изменения. Сначала я подумал, что это происходит потому, что состояние абстрактно и имеет детей, поэтому оно никогда не активируется напрямую, но даже когда я изменил его на неабстрактное и одно из "самых глубоких" состояний (т. Е. Лист при просмотре состояний внутри древовидная структура), проблема сохраняется. Странно то, что этого не происходит в других штатах.

Я пробовал разные подходы и внимательно прочитал документацию, но не смог найти причину проблемы.

Ниже приведен код, который я использую для регистрации состояний. Штат app.festival у меня проблема с:

  • когда я ссылаюсь на app.festival.overview впервые указать, например, с URL /festival/33/overview, контроллер состояния, а также его абстрактный родительский контроллер для app.festival правильно инициализированы
  • но потом, когда я возвращаюсь куда-то еще, а затем ссылку на что-то вроде /festival/21/overviewтолько контроллер этого состояния повторно инициализируется, но не его абстрактный родительский контроллер (хотя параметр для festivalId является частью этого и должен вызвать перезагрузку, я полагаю)
  • это приводит к фактическим данным фестиваля (ссылается на festivalId) который управляется app.festival состояние остается неизменным во всем приложении, потому что в основном оно просто инициализирует один "экземпляр" контроллера для app.festival независимо от разных $stateParams

Причина, по которой мне нужна эта структура, заключается в том, что должен быть целый раздел страниц (состояний), посвященный одному фестивалю (которым должен управлять app.festival государство).

$stateProvider

.state( 'app', {
    url: '',
    abstract: true,
    views: {
        'appContent': {
            templateUrl: 'views/main.html',
            controller: 'MainCtrl'
        }
    }
})

.state( 'app.general', {
    url: '/general',
    abstract: true,
    views: {
        'mainContent': {
            templateUrl: 'views/sections/general.html',
            controller: 'GeneralCtrl'
        }
    }
})

.state( 'app.festival', {
    url: '/festival/{festivalId:int}',
    abstract: true,
    views: {
        'mainContent': {
            templateUrl: 'views/sections/festival.html',
            controller: 'FestivalCtrl'
        }
    }
})

.state( 'app.general.festivals', {
    url: '/festivals',
    views: {
        'generalContent': {
            templateUrl: 'views/pages/general-festivals.html',
            controller: 'GeneralFestivalsCtrl'
        }
    }
})

.state( 'app.general.events', {
    url: '/events',
    views: {
        'generalContent': {
            templateUrl: 'views/pages/general-events.html',
            controller: 'GeneralEventsCtrl'
        }
    }
})

.state( 'app.general.event', {
    url: '/events/{eventId:int}',
    views: {
        'generalContent': {
            templateUrl: 'views/pages/general-event.html',
            controller: 'GeneralEventCtrl'
        }
    }
})

.state( 'app.festival.overview', {
    url: '/overview',
    views: {
        'festivalContent': {
            templateUrl: 'views/pages/festival-overview.html',
            controller: 'FestivalOverviewCtrl'
        }
    }
});

.state( 'app.festival.guide', {
    url: '/guide',
    views: {
        'festivalContent': {
            templateUrl: 'views/pages/festival-guide.html',
            controller: 'FestivalGuideCtrl'
        }
    }
});

Было бы здорово, если бы кто-нибудь мог мне помочь, потому что я потратил несколько часов на изучение проблемы, но пока не нашел решения. Если вам нужно больше узнать о конкретных частях кода, я с удовольствием выложу его и здесь.

1 ответ

Решение

Это стандартное поведение Ionic. Это по умолчанию кэширует представление и выполнение контроллера для повышения производительности. Вы можете отключить его с cache: false:

$stateProvider.state('myState', {
   cache: false,
   url : '/myUrl',
   templateUrl : 'my-template.html'
});

Или вы можете отключить его на уровне URL, используя ui-sref-opts как поставить опцию перезагрузки в разметке ui-sref

Смотрите Кэширование документов.

Другие вопросы по тегам