Posts

Showing posts from August, 2017

Contact List by useing Firebase

run command. Make for apk -  npm install promise-polyfill --save-exact npm install angularfire2 firebase --save First Create a new page under src folder (environments) and then create and new file (environment.ts). environment.ts  import this export const environment = { production: false, firebase: { apiKey: "AIzaSyAs7L8jvLomQInVEWI6h2jwzuZy9w20czM", authDomain: "mycontactlist-81682.firebaseapp.com", databaseURL: "https://mycontactlist-81682.firebaseio.com", projectId: "mycontactlist-81682", storageBucket: "mycontactlist-81682.appspot.com", messagingSenderId: "987292039015" } }; app.module.ts import { AngularFireDatabase, FirebaseListObservable } from 'angularfire2/database'; import { AngularFireModule } from 'angularfire2'; import { AngularFireDatabaseModule } from 'angularfire2/database'; import { AngularFireA...

ionic3Flash Light

Add plugin in your node ionic cordova plugin add cordova-plugin-flashlight npm install --save @ionic-native/flashlight First import in :   app.module.ts import { Flashlight } from '@ionic-native/flashlight'; Then:   providers: [     StatusBar,     SplashScreen,     {provide: ErrorHandler, useClass: IonicErrorHandler},     Flashlight   ] }) Home.html <ion-content>     <ion-fab middle center>         <button ion-fab color="{{isOn ? 'danger' : 'secondary'}}" (click)="toggleFlash()">     <ion-icon  name="{{isOn ? 'power' : 'power'}}"></ion-icon>     </button>     </ion-fab> </ion-content> HomePage.ts import {  Component} from '@angular/core'; import {  NavController } from 'ionic-angular'; import {  Flashlight } from '@ionic-native/flashlight'; @Component( {   selec...

Reduc Time Out for loading app

// If Android ionic emulate android -- prod ionic build android -- prod ionic run android -- prod ionic cordova run android --prod // If iOS ionic emulate ios -- prod ionic build ios -- prod ionic run ios -- prod

UI Letest Slider Gallary

Project.html <ion-scroll scrollX style="height:127px;">             <div class="scroll-item" *ngFor="let item of RoundImage">                 <img class="images-curcle" src="{{item.image}}" imageViewer />             </div>  </ion-scroll> Project.scss    ion-scroll[scrollX] {         white-space: nowrap;         .scroll-item {             display: inline-block;         }     }     .images-curcle {         height: 110px;         width: 110px;         padding: 8px;         border-radius: 80px !important;     } Project.ts export class Offdetails {   RoundImage:any[];   constructor(public navCtrl: NavController) {...

Contact useing ionic, angular-js and Firebase

Image
https://github.com/angular/angularfire2/blob/master/docs/1-install-and-setup.md#1-create-a-new-project 1. Create a new project c:\ ionic start Contact tabs --v3 c:\ cd Contact 2. Install AngularFire 2 and Firebase npm install angularfire2 firebase --save npm install angularfire2@5.0.0-rc.4 Make for apk -  npm install promise-polyfill --save-exact File Format of Firebase 3. Run project in node c:\Contact> ionic serve --lab 4. Add Firebase config to environments variable 5. Setup @NgModule for the AngularFireModule in app.module.ts 5. Setup environment.ts Make a folder environments and under environments make a file environment.ts 6. create a new page . c:\Contact>  ionic generate page contact 7. setup contact.html page  8. setup contact.ts page 9. create a new page . c:\Contact>  ionic generate page addcontact 10. Setup addcontact.html page 11. set...