当我加载应用程序时，我试图从模板文件夹获取仪表板 View 。我正在使用 Ionic 框架。
我的索引
<body ng-app="starter">
<ion-pane>
<ion-header-bar class="bar bar-header bar-dark main-header">
<h1 class="title main-header-title"><strong>Recharge Plans</strong></h1>
</ion-header-bar>
<ion-nav-view></ion-nav-view>
</ion-pane>
我的app.js
angular.module('starter', ['ionic','starter.controller','starter.service'])
.config(function($stateProvider, $urlRouterProvider) {
$stateProvider
.state('dash', {
url: '/dash',
views: {
'dash': {
templateUrl: '/templates/dash.html',
controller: 'DashCtrl'
}
}
});
$urlRouterProvider.otherwise('/dash');
});
我的controller.js
angular.module('starter.controller',[])
.controller('DashCtrl', function($scope) {
alert("ok");
})
在“www\templates”中，我有一个名为 dash.html 的文件。
我的 dash.html 是
<ion-view ng-controller="DashCtrl">
<ion-content>
<div class="list searc-panel">
<label class="item item-input item-select">
<div class="input-label">
Select Operator
</div>
<select>
<option>Select</option>
<option>Airtel</option>
<option>Vodafone</option>
</select>
</label>
<label class="item item-input item-select">
<div class="input-label">
Select State
</div>
<select>
<option>Select</option>
<option>West bengal</option>
<option>Kolkata</option>
</select>
</label>
<button class="button button-full button-positive">
Search My Plans
</button>
</div>
</ion-content>
</ion-view>
但是当我在浏览器中点击“file:///C:/Users/Sanjeev/RechargePlans/www/index.html”时，它会将我呈现为“file:///C:/Users/Sanjeev/RechargePlans/” www/index.html#/dash' 带有空白 View 。
我想念什么？
最佳答案
如果您要使用 Ionic 命名 View ，那么您的 ion-view 选项卡 HTML 需要如下所示:
<ion-nav-view name="you-view-name"></ion-nav-view>
通常，使用 Ionic 应用程序时，您有一个根状态，一切都源于此，因此:
app.js 文件:
angular.module('starter', ['ionic','starter.controller','starter.service'])
.config(function($stateProvider, $urlRouterProvider) {
$stateProvider
.state('root', {
url: '/',
templateUrl: '/templates/tabs.html',
controller: 'rootCtrl'
}
});
.state('root.dash', {
url: '/dash',
views: {
'dash': {
templateUrl: '/templates/dash.html',
controller: 'DashCtrl'
}
}
});
$urlRouterProvider.otherwise('/dash');
});
index.html:
<ion-nav-view></ion-nav-view>
tabs.html:
<ion-nav-view name="dash"></ion-nav-view>
无论如何，如果您要命名 View ，您的 ion-view HTML 标记需要有一个 name 属性，其中包含 View 的名称。
希望这有帮助
关于angularjs - Angular url 配置不适用于 ionic 框架，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/28935794/