2016-04-05 2 views
3

У меня проблема с ионной и ui-routing, когда я перехожу в дочернее состояние, URL обновляется, но вид остается тем же.угловое-ui-routing не меняет вид

это мой routing.js

.config(function($stateProvider, $urlRouterProvider, $locationProvider, $ionicConfigProvider) { 

    $ionicConfigProvider.views.maxCache(0); 

    $stateProvider 

     .state('app', { 
      url: "/", 
      abstract: true, 
      templateUrl: "menu.html", 
      controller: "menuCtrl" 
     }) 

     .state('app.home', { 
      url: "home", 
      cache: false, 
      views: { 
       'menuContent': { 
        templateUrl: "home.html", 
        controller: "homeCtrl" 
       } 
      } 
     }) 

     .state('app.search', { 
      url: "search", 
      views: { 
       'menuContent': { 
        templateUrl: "search.html", 
        controller: "searchCtrl" 
       } 
      } 
     }) 

     .state('app.search.product', { 
      url: "/product/:id", 
      views: { 
       'menuContent': { 
        templateUrl: "productPage.html", 
        controller: "singleProductCtrl" 
       } 
      } 
     }) 

     .state('app.search.product.market', { 
      url: "/product/:id", 
      views: { 
       'menuContent': { 
        templateUrl: "market.html",, 
        controller: "marketCtrl' 
       } 
      } 
     }); 
    // if none of the above states are matched, use this as the fallback 
    $urlRouterProvider.otherwise('/home'); 
}); 

в этом примере, когда я пытаюсь войти в app.search.product вид не меняется, даже если я туда вставленной непосредственно правильный URL в браузер. Я также судимый с Ui-sref-КЛЮЧОМ = "{перезагрузки: истинный}. Вариантом, но ничего изменить

Вот plunker, который показывает проблему (после поиска мнения не меняется) https://plnkr.co/edit/JrNFkV50klZItOQS18Iu

+0

я перейти от дома -> Поиск и поисково-> дома. и я не вижу никакого другого пункта меню –

ответ

2

У меня нет опыта работы с Ионный, но на основе ui-router config angular ожидает вложенное представление, но ваша страница имеет только один вид. Значение, второй уровень (продукт) не имеет представления для загрузки. Поскольку Ionic, я полагаю, не допускает вложенных ионных представлений (было бы смешно, если бы это было так), вы можете использовать обычный ui-view как вложенный.

<ion-view view-title="Search"> 
<ion-content> 
    <h1>Search</h1> 
    <a ui-sref=".product({id: 1})">Go to product</a> 
    <ui-view name="secondLevel"></ui-view> 
</ion-content> 

Проверьте код с модификациями здесь: https://plnkr.co/edit/LdgmoAEo1pS9spi1Su1z.

Не уверен, что это то, что вы искали. Основываясь на вашем plunkr, похоже, что вы случайно определили вложенный вид. В этом случае решение было бы удалить .search из * .product государственных названий: https://plnkr.co/edit/PGICsBhzyCOTSe9af4yu

 .state('app.product', { 
      url: "/product/:id", 
      views: { 
       'menuContent': { 
        templateUrl: "productPage.html" 
       } 
      } 
     }) 

     .state('app.market', { 
      url: "/product/:id", 
      views: { 
       'menuContent': { 
        templateUrl: "market.html" 
       } 
      } 
     }); 
+0

спасибо, я использовал это ... также [это] (http://stackoverflow.com/a/36426578/6160786) работает – Doc

0

попробовать положить в Ui-sref имени государства продукта в Перейдите по ссылке продукт теге что щ-sref = «app.product»

1

Используйте эту конфигурацию:.

$stateProvider 

     .state('app', { 
      url: "/", 
      abstract: true, 
      templateUrl: "menu.html", 
     }) 

     .state('app.home', { 
      url: "home", 
      views: { 
       'menuContent': { 
        templateUrl: "home.html" 
       } 
      } 
     }) 

     .state('app.search', { 
      url: "search", 
      views: { 
       'menuContent': { 
        templateUrl: "search.html" 
       } 
      } 
     }) 

     .state('app.product', { 
      url: "/product/:id", 
      views: { 
       'menuContent': { 
        templateUrl: "productPage.html" 
       } 
      } 
     }) 

     .state('app.market', { 
      url: "/product/:id", 
      views: { 
       'menuContent': { 
        templateUrl: "market.html" 
       } 
      } 
     }); 

Когда вы объявляете «приложение .search.product ', например, это означает, что в шаблон состояния поиска (search.html) должен иметь представление для загрузки состояния детей, и это не так, ваши представления перемещаются на одном уровне «0»

Смежные вопросы