added example code

Author: daniel-lang

README.md

@@ -1,8 +1,10 @@
 <?xml version='1.0' encoding='utf-8'?>
-<widget id="io.ionic.starter" version="0.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
-    <name>MyApp</name>
-    <description>An awesome Ionic/Cordova app.</description>
-    <author email="hi@ionicframework" href="http://ionicframework.com/">Ionic Framework Team</author>
+<widget id="com.typeorm.ionic" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
+    <name>TypeORM-Ionic</name>
+    <description>A simple app to test typeorm with cordova sqlite in ionic</description>
+    <author email="[email protected]">
+        Daniel Lang
+    </author>
     <content src="index.html" />
     <access origin="*" />
     <allow-navigation href="http://ionic.local/*" />
@@ -19,11 +21,6 @@
     <preference name="BackupWebStorage" value="none" />
     <preference name="SplashMaintainAspectRatio" value="true" />
     <preference name="FadeSplashScreenDuration" value="300" />
-
-    <!--
-      Change these to configure how the splashscreen displays and fades in/out.
-      More info here: https://github.com/apache/cordova-plugin-splashscreen
-    -->
     <preference name="SplashShowOnlyFirstTime" value="false" />
     <preference name="SplashScreen" value="screen" />
     <preference name="SplashScreenDelay" value="3000" />
@@ -82,10 +79,14 @@
         <splash height="960" src="resources/ios/splash/Default@2x~iphone.png" width="640" />
         <splash height="480" src="resources/ios/splash/Default~iphone.png" width="320" />
         <splash height="2732" src="resources/ios/splash/Default@2x~universal~anyany.png" width="2732" />
+        <icon height="1024" src="resources/ios/icon/icon-1024.png" width="1024" />
     </platform>
     <plugin name="ionic-plugin-keyboard" spec="~2.2.1" />
     <plugin name="cordova-plugin-whitelist" spec="1.3.1" />
     <plugin name="cordova-plugin-statusbar" spec="2.2.2" />
     <plugin name="cordova-plugin-device" spec="1.1.4" />
     <plugin name="cordova-plugin-splashscreen" spec="~4.0.1" />
+    <plugin name="cordova-sqlite-storage" spec="^2.0.4" />
+    <engine name="ios" spec="~4.4.0" />
+    <engine name="android" spec="~6.2.3" />
 </widget>

config.xml

@@ -1,5 +1,8 @@
 {
   "name": "ionic-example",
   "app_id": "",
-  "type": "ionic-angular"
+  "type": "ionic-angular",
+  "integrations": {
+    "cordova": {}
+  }
 }

ionic.config.json

@@ -1,38 +1,63 @@
 {
-  "name": "ionic-example",
-  "version": "0.0.1",
-  "author": "Ionic Framework",
-  "homepage": "http://ionicframework.com/",
-  "private": true,
-  "scripts": {
-    "clean": "ionic-app-scripts clean",
-    "build": "ionic-app-scripts build",
-    "lint": "ionic-app-scripts lint",
-    "ionic:build": "ionic-app-scripts build",
-    "ionic:serve": "ionic-app-scripts serve"
-  },
-  "dependencies": {
-    "@angular/common": "4.1.3",
-    "@angular/compiler": "4.1.3",
-    "@angular/compiler-cli": "4.1.3",
-    "@angular/core": "4.1.3",
-    "@angular/forms": "4.1.3",
-    "@angular/http": "4.1.3",
-    "@angular/platform-browser": "4.1.3",
-    "@angular/platform-browser-dynamic": "4.1.3",
-    "@ionic-native/core": "3.12.1",
-    "@ionic-native/splash-screen": "3.12.1",
-    "@ionic-native/status-bar": "3.12.1",
-    "@ionic/storage": "2.0.1",
-    "ionic-angular": "3.6.1",
-    "ionicons": "3.0.0",
-    "rxjs": "5.4.0",
-    "sw-toolbox": "3.6.0",
-    "zone.js": "0.8.12"
-  },
-  "devDependencies": {
-    "@ionic/app-scripts": "2.1.4",
-    "typescript": "2.3.4"
-  },
-  "description": "An Ionic project"
-}
+    "name": "ionic-example",
+    "version": "1.0.0",
+    "author": "Daniel Lang",
+    "scripts": {
+        "clean": "ionic-app-scripts clean",
+        "build": "ionic-app-scripts build",
+        "lint": "ionic-app-scripts lint",
+        "ionic:build": "ionic-app-scripts build",
+        "ionic:serve": "ionic-app-scripts serve"
+    },
+    "config": {
+        "ionic_webpack": "./config/webpack.config.js"
+    },
+    "dependencies": {
+        "@angular/common": "4.4.3",
+        "@angular/compiler": "4.4.3",
+        "@angular/compiler-cli": "4.4.3",
+        "@angular/core": "4.4.3",
+        "@angular/forms": "4.4.3",
+        "@angular/http": "4.4.3",
+        "@angular/platform-browser": "4.4.3",
+        "@angular/platform-browser-dynamic": "4.4.3",
+        "@ionic-native/core": "4.3.0",
+        "@ionic-native/splash-screen": "4.3.0",
+        "@ionic-native/status-bar": "4.3.0",
+        "@ionic/storage": "2.0.1",
+        "cordova-android": "^6.2.3",
+        "cordova-ios": "^4.4.0",
+        "cordova-plugin-device": "^1.1.4",
+        "cordova-plugin-splashscreen": "^4.0.3",
+        "cordova-plugin-statusbar": "^2.2.2",
+        "cordova-plugin-whitelist": "^1.3.1",
+        "cordova-sqlite-storage": "^2.0.4",
+        "ionic-angular": "3.7.0",
+        "ionic-plugin-keyboard": "^2.2.1",
+        "ionicons": "3.0.0",
+        "rxjs": "5.4.3",
+        "sw-toolbox": "3.6.0",
+        "typeorm": "0.1.0-alpha.49",
+        "zone.js": "0.8.17"
+    },
+    "devDependencies": {
+        "@ionic/app-scripts": "^3.0.0",
+        "@types/node": "^8.0.31",
+        "typescript": "2.3.4"
+    },
+    "description": "An Ionic project",
+    "cordova": {
+        "plugins": {
+            "cordova-plugin-device": {},
+            "cordova-plugin-splashscreen": {},
+            "cordova-plugin-statusbar": {},
+            "cordova-plugin-whitelist": {},
+            "ionic-plugin-keyboard": {},
+            "cordova-sqlite-storage": {}
+        },
+        "platforms": [
+            "android",
+            "ios"
+        ]
+    }
+}

package.json

@@ -0,0 +1 @@
+3f1bbdf1aefcb5ce7b60770ce907c68f

resources/android/icon/drawable-hdpi-icon.png

@@ -0,0 +1 @@
+0dcf1df8c92c1ece4382d3357d9f8562

resources/android/icon/drawable-ldpi-icon.png

@@ -6,6 +6,7 @@ import { StatusBar } from '@ionic-native/status-bar';
 
 import { MyApp } from './app.component';
 import { HomePage } from '../pages/home/home';
+import { DatabaseProvider } from '../providers/database';
 
 @NgModule({
   declarations: [
@@ -24,7 +25,8 @@ import { HomePage } from '../pages/home/home';
   providers: [
     StatusBar,
     SplashScreen,
-    {provide: ErrorHandler, useClass: IonicErrorHandler}
+    {provide: ErrorHandler, useClass: IonicErrorHandler},
+    DatabaseProvider
   ]
 })
 export class AppModule {}

resources/android/icon/drawable-mdpi-icon.png

@@ -0,0 +1,18 @@
+import {Entity, Column, PrimaryGeneratedColumn, OneToMany} from "typeorm";
+import {Post} from "./post";
+
+@Entity('author')
+export class Author {
+
+    @PrimaryGeneratedColumn()
+    id: number;
+
+    @Column()
+    name: string;
+
+    @Column({nullable: true})
+    birthdate: string;
+
+    @OneToMany(type => Post, post => post.author)
+    posts: Post[];
+}

resources/android/icon/drawable-xhdpi-icon.png

@@ -0,0 +1,12 @@
+import {Entity, PrimaryGeneratedColumn, Column} from "typeorm";
+
+@Entity('category')
+export class Category {
+
+    @PrimaryGeneratedColumn()
+    id: number;
+
+    @Column()
+    name: string;
+
+}

resources/android/icon/drawable-xxhdpi-icon.png

@@ -0,0 +1,27 @@
+import {Entity, PrimaryGeneratedColumn, Column, ManyToMany, JoinTable, ManyToOne} from "typeorm";
+import {Category} from "./category";
+import {Author} from "./author"
+
+@Entity('post')
+export class Post {
+
+    @PrimaryGeneratedColumn()
+    id: number;
+
+    @Column()
+    title: string;
+
+    @Column("text")
+    text: string;
+
+    @ManyToMany(type => Category, {
+        cascadeInsert: true
+    })
+    @JoinTable()
+    categories: Category[];
+
+    @ManyToOne(type => Author, author => author.posts, {
+      cascadeInsert: true
+    })
+    author: Author;
+}

resources/android/icon/drawable-xxxhdpi-icon.png

@@ -1,14 +1,25 @@
 <ion-header>
   <ion-navbar>
     <ion-title>
-      Ionic Blank
+      TypeORM Demo
     </ion-title>
   </ion-navbar>
 </ion-header>
 
-<ion-content padding>
-  The world is your oyster.
-  <p>
-    If you get lost, the <a href="http://ionicframework.com/docs/v2">docs</a> will be your guide.
-  </p>
+<ion-content>
+  <ion-list>
+    <ion-item>
+      <ion-spinner *ngIf="!savedPost" item-start></ion-spinner>
+      <ion-icon *ngIf="savedPost" name="checkmark" item-start color="secondary"></ion-icon>
+      <span>Post saved</span>
+    </ion-item>
+    <ion-item-divider color="primary">Loaded Post</ion-item-divider>
+    <ion-item *ngIf="!loadedPost">Post not loaded</ion-item>
+    <ion-item-group *ngIf="loadedPost">
+      <ion-item>ID: {{loadedPost?.id}}</ion-item>
+      <ion-item>Title: {{loadedPost?.title}}</ion-item>
+      <ion-item>Author: {{loadedPost?.author.name}}</ion-item>
+      <ion-item>Categories: {{getCategories()}}</ion-item>
+    </ion-item-group>
+  </ion-list>
 </ion-content>

resources/android/splash/drawable-land-hdpi-screen.png

@@ -1,14 +1,66 @@
 import { Component } from '@angular/core';
-import { NavController } from 'ionic-angular';
+import { Platform, NavController } from 'ionic-angular';
+
+import { DatabaseProvider } from '../../providers/database';
+
+import { Author } from '../../entities/author';
+import { Category } from '../../entities/category';
+import { Post } from '../../entities/post';
 
 @Component({
   selector: 'page-home',
   templateUrl: 'home.html'
 })
 export class HomePage {
+  private savedPost: boolean = false;
+  private loadedPost: Post = null;
+
+  constructor(public navCtrl: NavController, private platform: Platform, private database: DatabaseProvider) { }
+
+  ionViewDidLoad() {
+    this.runDemo();
+  }
+
+  async runDemo() {
+    await this.platform.ready();
+    const category1 = new Category();
+    category1.name = "TypeScript";
+
+    const category2 = new Category();
+    category2.name = "Programming";
+
+    const author = new Author();
+    author.name = "Person";
+
+    const post = new Post();
+    post.title = "Control flow based type analysis";
+    post.text = `TypeScript 2.0 implements a control flow-based type analysis for local variables and parameters.`;
+    post.categories = [category1, category2];
+    post.author = author;
+
+    const connection = await this.database.getConnection();
+    const postRepository = connection.getRepository(Post);
+    await postRepository.save(post);
+
+    console.log("Post has been saved");
+    this.savedPost = true;
+
+    const loadedPost = await postRepository.createQueryBuilder('post')
+      .innerJoinAndSelect('post.author', 'author')
+      .innerJoinAndSelect('post.categories', 'categories')
+      .where('post.id = :id', {id: post.id})
+      .getOne();
+
+    console.log("Post has been loaded: ", loadedPost);
+    this.loadedPost = loadedPost;
+  }
 
-  constructor(public navCtrl: NavController) {
+  getCategories() {
+    if(this.loadedPost) {
+      return this.loadedPost.categories.map(cat => cat.name).join(",");
+    }
 
+    return '';
   }
 
 }