2015-10-17 33 views
1

我在兩個diff代碼中獲取兩個流。 我正在開發基於ionicframework的應用程序,使用其默認(基於角度的ui-router)路由。 現在,當我編碼離子這種方式。如何在IonicFramework中只加載所需的模板

*.config(["$stateProvider","$urlRouterProvider",function ($stateProvider,$urlRouterProvider) { 

     $urlRouterProvider 
      .otherwise('oops'); 
     $stateProvider 
      .state('dashboard',{ 
        url:"/dashboard", 
        abstract: true, 
        templateUrl:'templates/dashboard.html', 
        controller:"myCtrl" 
       }) 
      .state('courses',{ 
        url:'/courses', 
        templateUrl:'templates/courses.html', 
        controller:'myCtrl' 
       }) 
      .state('transactions',{ 
        url:'/transactions', 
        templateUrl:'templates/transactions.html' 
       }) 
      .state('oops',{ 
       url:'/oops', 
       templateUrl:'templates/oops.html', 
       controller:'myCtrl' 
      }) 
     }])* 

觀點:

<ion-nav-view></ion-nav-view> 

我發現我的所有模板都得到加載一次(在瀏覽器控制檯測試),當我把我的基本路線(也可用於任何路線,無論我呼籲第一加載的應用程序)。

其中,當我使用UI-路由器的非離子型的應用等:

myApp.config(function($stateProvider,$urlRouterProvider){ 

    /*throw the rest url to home page*/ 
    $urlRouterProvider.otherwise("/single"); 

    $stateProvider 
     .state("single",{ 
      url:"/single", 
      templateUrl:"templates/single.html" 
     }) 
     .state("portfolio",{ 
      url:'/portfolio', 
      templateUrl:'templates/portfolio.html', 
      controller:"myCtrl" 
     }) 
     .state("nested",{ 
      url:"/nested", 
      templateUrl:"templates/nested.html" 
      } 
     ) 
     .state("nested.viwe1",{ 
      url:"/view1", 
      templateUrl:"templates/nested.view1.html" 
     }) 
     .state("nested.viwe2",{ 
      url:"/view2", 
      templateUrl:"templates/nested.view2.html" 
     }) 

}); 

視圖:

<div ui-view class="my-element"></div> 

僅要求模板(與路線配置的),是越來越加載。 因此,Ionic最初加載所有模板,否則我的代碼錯誤。

回答