cordova - Porting angular app to ionic -
i have angular app , trying port ionic framework. looked @ sample app generated starter templates , noticed core angular app under www folder. created ionic starter app, , moved angular app under www folder.
****i able serve app using ionic serve, , works fine
however when use ionic emulate, emulator shows home page , throwing errors unable open asset url: file:///android_asset/views/landing.html
so have use ionic tags app work correctly? since ionic serve renders app correctly assumed work fine in emulator well.
this index.html looks like. using angular , bootstrap , no ionic tags.
<!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> i using ui-route in angular app
(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' })
i'm glad have solved problem.
just share experience, notice ionic emulation gives same errors said if put ui-router state url leading "/". works fine on browser. strange is, removed leading slash thereafter, , works perfectly.
Comments
Post a Comment