I am trying to build my angularjs app into an android app using PhoneGap Build, but got stucked with the issue of the src of ng-include.
The code below tries to render a html of subheader into the view. It works perfectly in chrome browser, however after I convert the code with phonegap, it does not work. I also tried other path like '../templates/subheader.html' and '/templates/subheader.html', none of them work.
<div class="bar bar-subheader bar-stable" ng-include="'templates/subheader.html'">
</div>
Any suggestions?
It is embarrassing to always answer my own question...
However I finally figured it out.
1. The path inside the ng-include should not have the "/" on its left most.
2. The key of this issue is not the ng-include. It is because I was trying to fetch a variable stored in the $cookieStore:
For some reason I don't know, the data stored in $cookieStore can't persist between page transition. It impact many components in my page. So I have to change the $cookieStore to another local storage service https://github.com/grevory/angular-local-storage.
I had the same problem, that my include was not shown on the device.
But my problem was that I put the template in an folder which's name started with an underscore _.
This is ignored in the build-process. Renaming the folder helped!
Did you have a chance to look at Ionic Framework ? It works on phonegap and has build in AngularJS support. It also has some mobile ready components.
Related
I have checked out the forum a lot and there are many similar question to this, but none have the answer what I am looking for so hope someone can help me!
I am building an app with phonegap and it have previously worked fine. Now it was time for an update of just some text and images in it, but also decided to get the newest version of everything.
I can launch my app on android just fine, but as soon as I click on a link to another page (internal) I get the following error:
net::ERR_FILE_NOT_FOUND(file:///android_asset/www/html/feriehus.html)
It used to work with the following code in the index.html, but does not anymore...does anybody know why?
<li><img src="img\feriehus.png" width="40"></li>
Kind regards, Kiam
Edit: Added images to show their location:
the root of www folder where index.html is located
The location of ferirhus.html is located
Change folder name from html to some other name. Because html is a reserved word so it might be creating problem.
I am trying to link a js file to my android application. If it's possible. To be more specific I am developing an app using HTML(I don’t need help with this part) and I want to get my template working, it has mixed parts of html, css and javascript. This is what I have so far at the head of my sheet. ( I don’t know how to make code appear on here, I do have the < & /> in the original.
link rel="javascript" href="java2/jquery/mobile-slide-menu.js"
script type="text/javascript" src="java2/jquery-mobile-slide-menu.js"
This is what I am trying to make:
http://jsfiddle.net/gh/gist/jquery/1.9.1/5624435/
Is it possible to have html,css and javascript in one page or do I have to link them for them to work.
Let me know if you need more information.
You can do it either way as you are not using the webview javascript bridge directly it does nto matter which way you choose
Your choice will depend on which way you want to keep track of changes in the javascript and html css combination ..separately through different files or one single html file
I have one simple question conserning PhoneJS http://phonejs.devexpress.com/Documentation
and it's demos - how to launch and preview them on Android devise?
I've loaded a package and tried to run demos through Eclipse, using
webView.loadUrl("file:///android/html/index.html");
But only black screen is visible.
Thanks!
I also not found this PhoneJS information in documentation. I wrote to support and they told me PhoneJS application is like any PhoneGap based application can be packaged with PhoneGap and in http://build.phonegap.com site.
PhoneGap Build worked well, but it is little slow.
Do you see any errors or simple black screen?
Possible files, mentioned in the index.html file, are spelled in the different case from files on the disk, e.g. you have line
script type="text/javascript" src="data/db.js"
but on the disk there is "Data" (not "data") folder or "Db.js" (not "db.js") file.
It makes sense then application is uploaded on android device. You should ensure file names spelling.
Thanks, Serge
I am developing android phonegap application. which has around 65 images (~10kb size for each). My application is working as expected on Ripple chrome plugin as well as on Chrome and FF browser. but when I load it on emulator some images are not able to load.
I have attached screenshot for the reference.
I tried using the jQuery preload plugin but no luck.
Can anyone help me please! Thanks
EDIT:
I have tried the same code without any change on iPhone and WindowsPhone7, Images are showing up fine on both the platform.
Try creating an identical copy of the image (../image_copy1.png, for example), and swap that code out in lieu of the image location that isn't working.
Sometimes emulator programs freak out with file paths either due to localized caching of data or actual logistical errors in the emulator program itself. Dreamweaver has similar problems, as do a host of other dev/testing suites - local caching of images is not an uncommon problem. You can circumvent this issue sometimes by uploading a copy of the desired file (but not copying it within the program itself) - causing a fresh, noncached upload of it. This is by no means a "proper" solution, but it's a quick and dirty workaround for a buggy emu/dev program.
If you are loading the images from an external source, you may need to 'whitelist' the source. Did you add the domain name into the Cordova config file? It is under res/xml/config.xml
<access origin="www.example.com" />
I know that it is necessary for cross domain AJAX requests but not sure for images, you could give it a try.
Can't help much.
Emulator acts cranky some times.
I have faced the issue multiple times.
At the best, you can try creating another avd-image... but at least I cannot guaranttee that it will work.
I was trying to display a webpage of a url on a plain WebView, and some of the images are not showing. However, everything shows up fine in the browser for the simulator.
Is there a difference between the rendering via WebView vs. the Android 2.3 Browser?
There are several things added to the Android browser. They add things in to handle JavaScript, to handle switching to native functionality for videos, etc. Luckily the Browser is open source so you can get the Android code base and see what they do.
Yes could be a difference. If you are passing the web text-plain to the webview directly it doesn't understand the images which are references depending the local path instead the goblal path reference.
I mean, if you have a <img src="/images/image.png" /> here you are referencing depending on your directory, and the browser try to look up image.png into your root, and if you have <img src="http://www.whatever.com/images/image.png" /> then you are referencing it globaly. So I think this is the main that you could have.