3
我有一個角度應用，我試圖移植到離子框架。我查看了由初學者模板生成的示例應用程序，並注意到核心角應用程序位於www文件夾下。 所以我創建了一個離子啓動器應用程序，並將我的角度應用程序移動到www文件夾下。將角度應用移植到離子
****我能夠使用離子服務就可以提供應用程序，並能正常工作
然而，當我使用離子模擬，仿真器只顯示我的主頁，並引發錯誤無法打開資產URL：file：///android_asset/views/landing.html
那麼，我必須使用離子標籤來讓我的應用程序正常工作嗎？由於Ionic服務器正確渲染我的應用程序，我認爲它也可以在模擬器中正常工作。
這就是我的index.html的樣子。它使用角度和自舉並且沒有離子標籤。
<!DOCTYPE html>
<html lang="en" data-ng-app="fhlLeads"><!-- manifest="manifest.appcache" -->
<head>
<title>FHL Leads</title>
<link rel="stylesheet" href="app/css/app.css" type="text/css" />
<link rel="stylesheet" href="app/css/base.min.css" type="text/css" />
<script type="text/javascript">
window.addEventListener('load', function (e) {
window.applicationCache.addEventListener('updateready', function (evt) {
if (window.applicationCache.status === window.applicationCache.UPDATEREADY) {
console.log('cache change detected; reloading page');
window.applicationCache.swapCache();
window.location.reload();
}
}, false);
}, false);
</script>
</head>
<body class="platform-android platform-cordova platform-webview">
<!-- Navbar -->
<div ng-include src="'views/partials/navbar.html'"></div>
<!-- Page Content -->
<div class="container-fluid">
<div class="row">
<fhl-page-loading></fhl-page-loading>
</div>
<div class="row"> </div>
<ui-view ></ui-view>
</div>
<!-- Footer -->
<div ng-include src="'views/partials/footer.html'"></div>
</body>
<script src="app/js/base.min.js" type="text/javascript"></script>
<script src="app/js/app.js" type="text/javascript"></script>
landing.html上
<div class="row">
<div class="col-lg-3 col-md-12 col-xs-12 pull-right">
<div class="hidden-xs">
<div ng-include src="'templates/partials/sync-status-panel.html'"></div>
</div>
<div ng-include src="'templates/partials/activity-panels.html'"></div>
</div>
<div class="col-lg-9 col-md-12 col-xs-12">
<div ng-include src="'templates/partials/lead-grid.html'"></div>
<!--<section>
<!-- Page content-->
<!--<div ui-view="" autoscroll="false" class="content-wrapper"></div>-->
<!--</section>-->
</div>
我使用的UI的路線在我的角度應用
(function() {
'use strict';
angular
.module('fhlLeads', [
'ui.router',
'ui.bootstrap',
'ui.mask',
'ui.utils',
'ngAnimate',
'ngGrid',
'toastr',
'LocalStorageModule',
'fhlConstants',
'fhlConfig',
'fhlPersist',
'fhlEvent'
])
.config(configure)
.run(runBlock);
configure.$inject = ['$stateProvider', '$urlRouterProvider', 'toastrConfig', 'localStorageServiceProvider'];
function configure($stateProvider, $urlRouterProvider, toastrConfig, localStorageServiceProvider) {
$urlRouterProvider.otherwise("/landing");
$stateProvider
.state('landing', {
url: '/landing',
templateUrl: 'Client/views/snapshot/landing.html',
controller: 'LandingController',
controllerAs: 'vm'
})
.state('agent', {
url: '/agent',
templateUrl: 'Client/views/agent/agent.html',
controller: 'AgentController',
controllerAs: 'vm'
})
我編輯了我的原始文章，以顯示我的landing.html中的代碼。我在我的角度應用程序中使用ui-router。 – 2015-04-22 21:35:01
將離子指令注入到您的應用程序將允許您使用離子指令。你的問題在於你的狀態像在www/clients/views中一樣定義你的視圖....並且我假設你沒有把這個結構放入你的項目 – aorfevre 2015-04-22 22:14:49
感謝你的輸入。我重寫了應用程序以使用離子指令來渲染視圖。我從一個初學者模板開始，並在我的應用程序中工作。它現在按預期工作。 – 2015-04-24 03:16:23