Wednesday, March 4, 2015

Ionic Route TemplateUrl Not Found Issue

Note that both of the following are working in browser & simulator, even run directly on the phone is good. However, when you package the app and install it on your phone, the template file will not be found.

This is a tricky one because when the app installed on the phone, unlike web deployment, it most likely is not installed at root of your phone, thus, it cannot find the file.

To solve this, just trying to avoid starting with '/' in your url mapping.

CORRECT

app.config(function($stateProvider, $urlRouterProvider) {

  $stateProvider
  .state('home', {
    url: '/home',
    templateUrl: 'template/list.html'
  });

  $urlRouterProvider.otherwise("/home");
});

WRONG

app.config(function($stateProvider, $urlRouterProvider) {

  $stateProvider
  .state('home', {
    url: '/home',
    templateUrl: '/template/list.html'
  });

  $urlRouterProvider.otherwise("/home");
});




Wednesday, February 11, 2015

[Mac OS] [Android SDK] [Ionic] [How to Fix] ionic platform add android - ANDROID_HOME is not set and "android" command not in your PATH.

  1. Download Android SDK & Unzip it
  2. Setup Environment Path
    • Open terminal, run 'vi ~/.bash_profile'
    • Add the following lines in that file
      • export ANDROID_HOME=/Users/Ian/Documents/Dev/android-sdk-macosx
      • export PATH=${PATH}:$ANDROID_HOME/tools:$ANDROID_HOME/platform-tools
    • Save & Exit
    • Run 'source ~/.bash_profile'
  3. Make sure you have the write permission for the sdk folder.
    • Run 'chmod -R 777 <Your sdk path> 
      • (e.g. chmod -R 777 /Users/xxx/Development/android_sdk_mac).
    • This is really important. I have spent a lot of time figuring this out. If you don't have the write permission, ionic will always throw 'ANDROID_HOME is not set and "android" command not in your PATH' error even if you have correctly set up all the environment variables and path.