微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

cordova – 将角度app移植到离子

我有一个有角度的应用程序,我正在尝试移植到离子框架.我查看了由初始模板生成的示例应用程序,并注意到核心角应用程序位于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">&nbsp;</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-route

(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'
        })

解决方法

我很高兴你解决了你的问题.

只是为了分享我的经验,我注意到如果我把ui-router状态url带有前导“/”,Ionic仿真会给出与你所说的相同的错误.这在浏览器上完全正常.奇怪的是,之后我删除了所有领先的斜线,它完美无缺.

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。

相关推荐