Deploying Angular to PhoneGAP

Question

We will develop application in Angular (separated from server), and most likely we will need to use PhoneGap to create same application for mobile devices.

PhoneGap requires that the application has index.html file as entry file in order to be compiled. I made minor project in Angular that has index file, and it did compile ok in PhoneGap.

There is something that I cant get my mind on. Server side will be in C#/MVC, and as I said already Client will be in Angular. Question is how to keep the project in Angular in "index.html" format ready for PhoneGap and at the same time have it available for normal web application.

We do plan to use AMD (require.js) for Angular application, but if we do that then we cant have Index.html file which is required for Phonegap.

What would be best approach. Goal is to if possible have one code base.

Answer 1

Well you don't have to specifically have an index.html page, you can use any HTML page as the landing page (See the content tag in the Config.xml page.) You should be able to just build your Angular app like you normally would - you can even test on the browser. When you go to actually create the Cordova/Phonegap apps, you'll just have to add the cordova.js to the file and then run the commands to build and package the app binaries.

Answer 2

I'm also building a PhoneGap 3 app using AngularJS connected to back-end APIs.

The PhoneGap / Cordova part is only added later in the /platforms folder, so in the root /www folder you should build just a regular mobile web app.

This app I'm working on uses a hash for the AngularJS routing. In iOS / Android runs from index.html (eg: ./index.html#/start) while on desktop browsers runs from the root folder (eg: /#/start).