首页 文章

离子:了解导航和路由

提问于
浏览
0

我正在学习Ionic中的导航和路由http://learn.ionicframework.com/formulas/navigation-and-routing-part-1/

我想了解映射,我没有从文档中清楚地了解它 .

下面的代码来自我的app.js.

app.config(function($stateProvider, $urlRouterProvider) {
      console.log('In Config');
      $urlRouterProvider.otherwise('/')

       $stateProvider.state('home', {
           url: '/home',
           views: {
               home: {
                   templateUrl: 'home.html'
               }
           }
         })
       })

以下代码来自Index.html

<ion-tabs class="tabs-positive">
    <ion-tab icon="ion-home" ui-sref="home">
      <ion-nav-view name="home"></ion-nav-view>
    </ion-tab>

我理解的是ui-serif用状态名称映射 . 我没有得到url,templateUrl和离子导航视图名称如何相互关联或映射到彼此,因为如果我更改其中任何一个我的应用程序不起作用 .

1 回答

  • 3

    让我稍微改变你的例子,这样你就可以理解更多:

    $stateProvider.state('homeState', {
               url: '/homeUri',
               views: {
                   homeName: {
                       templateUrl: 'home.html'
                   }
               }
             })
    

    在您的页面中引用如下:

    <ion-tab icon="ion-home">
          <ion-nav-view name="homeName"></ion-nav-view>
        </ion-tab>
    

    或者您可以使用href访问它:

    <a href="{{homeUri}}">
    

    或者使用ui-router路由

    <a ui-sref="homeState">
    

相关问题