ページが表示されない[Ionic]

Question

私はIonicとAngularJSの初心者です。私はIonicアプリに位置情報ファイルを表示しようとしていますが、このページのコンテンツは表示されません。 URLは変化しています。前もって感謝します。

コール

<a class="item item-icon-left " href="#/tab/locations"> <i class="icon ion-search"></i> Near Places </a> 

場所ファイルへApp.js

angular.module('starter', ['ionic', 'starter.controllers', 'starter.services']) 

.run(function($ionicPlatform) { 
    $ionicPlatform.ready(function() { 

    if (window.cordova && window.cordova.plugins && window.cordova.plugins.Keyboard) { 
     cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true); 
     cordova.plugins.Keyboard.disableScroll(true); 

    } 
    if (window.StatusBar) { 

     StatusBar.styleDefault(); 
    } 
    }); 
}) 

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

    $stateProvider 

    .state('tab', { 
    url: '/tab', 
    abstract: true, 
    templateUrl: 'templates/tabs.html' 
    }) 


    .state('tab.dash', { 
    url: '/dash', 
    views: { 
     'tab-dash': { 
     templateUrl: 'templates/tab-dash.html', 
     controller: 'DashCtrl' 
     } 
    } 
    }) 

    .state('tab.locations', { 
     url: '/locations', 
     views: { 
     'tab-locations': { 
      templateUrl: 'templates/tab-locations.html', 
      controller: 'LocationCtrl' 
     } 
     } 
    }) 

    .state('tab.chats', { 
     url: '/chats', 
     views: { 
     'tab-chats': { 
      templateUrl: 'templates/tab-chats.html', 
      controller: 'ChatsCtrl' 
     } 
     } 
    }) 
    .state('tab.chat-detail', { 
     url: '/chats/:chatId', 
     views: { 
     'tab-chats': { 
      templateUrl: 'templates/chat-detail.html', 
      controller: 'ChatDetailCtrl' 
     } 
     } 
    }) 

    .state('tab.search', { 
    url: '/search', 
    views: { 
     'tab-search': { 
     templateUrl: 'templates/tab-search.html', 
     controller: 'AccountCtrl' 
     } 
    } 
    }); 


    $urlRouterProvider.otherwise('/tab/dash'); 

}); 

ファイル名：タブlocations.html

<ion-view view-title="location"> 
<ion-content> 
<div class="list list-inset"> 
    <label class="item item-input"> 
    <i class="icon ion-search placeholder-icon"></i> 
    <input type="text" placeholder="Search"> 
    </label> 
</div> 
</ion-content> 

Tabs.html

<ion-tabs class="tabs-icon-top tabs-color-active-positive"> 

    <!-- Dashboard Tab --> 
    <ion-tab title="Status" icon-off="ion-ios-pulse" icon-on="ion-ios-pulse-strong" href="#/tab/dash"> 
    <ion-nav-view name="tab-dash"></ion-nav-view> 
    </ion-tab> 

    <!-- Chats Tab --> 
    <ion-tab title="Chats" icon-off="ion-ios-chatboxes-outline" icon-on="ion-ios-chatboxes" href="#/tab/chats"> 
    <ion-nav-view name="tab-chats"></ion-nav-view> 
    </ion-tab> 

    <!-- Account Tab --> 
    <ion-tab title="Account" icon-off="ion-ios-gear-outline" icon-on="ion-ios-gear" href="#/tab/account"> 
    <ion-nav-view name="tab-account"></ion-nav-view> 
    </ion-tab> 


</ion-tabs> 

Answer 1

仕事にtab.locations状態にするためには、あなたはtemplates/tabs.htmlで新しいタブLocationを追加する必要があります。さらに、name="tab-locations"もあるので、tab.locationsはその中にテンプレートを配置します。

<ion-tab title="Locations" icon-off="ion-ios-gear-outline" 
icon-on="ion-ios-gear" href="#/tab/account"> 
    <ion-nav-view name="tab-locations"></ion-nav-view> 
</ion-tab>