離子路由 - 啓動視圖

我在學習離子框架，我一直在閱讀路由方面的東西，這是我有點卡住了。離子路由 - 啓動視圖

我有我的應用程序工作，但現在我想添加更多的意見。所以，我已經開始把我的家庭視爲一個名爲「家」的國家（對不起，如果我不使用正確的術語）。

確定這裏是我的html：

<!DOCTYPE html> 

<html ng-app="ionic.example"> 
    <head> 
    <meta charset="utf-8"> 
    <title>Venues</title> 

    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no"> 

    <link href="lib/ionic/css/ionic.css" rel="stylesheet"> 
    <link href="css/style.css" rel="stylesheet"> 

    <!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above 
    <link href="css/ionic.app.css" rel="stylesheet"> 
    --> 

    <!-- ionic/angularjs js --> 
    <script src="lib/ionic/js/ionic.bundle.js"></script> 

    <!-- cordova script (this will be a 404 during development) --> 
    <script src="cordova.js"></script> 

    <!-- your app's js --> 
    <script src="js/app.js"></script> 



    </head> 
    <body>  




    <ion-pane> 

     <ion-header-bar class="bar-positive"> 
     <div class="buttons"> 
     <button class="button button-icon button-clear ion-navicon" menu-toggle="left"></button> 
     </div> 
     <h1 class="title">Venues</h1> 
     </ion-header-bar> 

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

     <ion-view nng-controller="MyCtrl" title="home"> 
     <ion-content class="has-header"> 

     <ion-list> 
      <ion-item ng-repeat="item in items"> 
      <a href="#/venue/{{ item[0].id }}"> 
       <div class="list card"> 
       <div class="item item-avatar"> 
       <img src="{{ item[0].profile_pic }}"> 
       <h2 class="item-venue-title">{{ item[0].name }}</h2> 
       <p class="item-location">UK</p> 
       </div> 
       <div class="item item-body"> 
       <img class="full-image" src="{{ item[0].heder_img }}"> 
       </div> 
      </a> 

      <div class="item tabs tabs-secondary tabs-icon-left"> 
       <a class="tab-item" href="#"> 
       <i class="icon ion-thumbsup"></i> 
       Like 
       </a> 
       <a class="tab-item" href="#"> 
       <i class="icon ion-chatbox"></i> 
       Comment 
       </a> 
       <a class="tab-item" href="#"> 
       <i class="icon ion-share"></i> 
       Share 
       </a> 
      </div> 
      </div> 

      </ion-item> 
     </ion-list> 

     <ion-infinite-scroll on-infinite="loadMore()" distance="10%"></ion-infinite-scroll> 

    </ion-content> 
    </ion-view> 




    <nav class="tabs tabs-icon-bottom tabs-positive"> 
     <a class="tab-item"> 
      Clean 
      <i class="icon ion-waterdrop"></i> 
     </a> 
     <a class="tab-item"> 
      Security 
      <i class="icon ion-locked"></i> 
     </a> 
     <a class="tab-item has-badge"> 
      Light 
      <i class="badge">3</i> 
      <i class="icon ion-leaf"></i> 
     </a> 
     <a class="tab-item"> 
      Clean 
      <i class="icon ion-waterdrop"></i> 
     </a> 
    </nav> 




     </ion-pane> 


    </body> 
</html>

我加入以下的js文件

var example=angular.module('ionic.example', ['ionic']) 


.config(function($stateProvider, $urlRouterProvider) { 
     $stateProvider 
      .state('home', { 
       url: '/home', 
       templateUrl: 'templates/home.html', 
       controller: 'MyCtrl' 
      }) 
      ; 
     $urlRouterProvider.otherwise('/home'); 
    });

我不明白的是你怎麼說這是「第一可以這麼說。

任何意見，將不勝感激。

來源

2015-05-11 BCLtd

.config(function($stateProvider, $urlRouterProvider) { $stateProvider .state('home', { url: '/', templateUrl: 'home.html', controller: 'MyCtrl' }) ; $urlRouterProvider.otherwise('/'); });

離子路由 - 啓動視圖

回答

相關問題