Quantcast
Channel: Ionic Framework - Ionic Forum
Viewing all 49085 articles
Browse latest View live

Screenshots for iTunes Connect on iOS... How can I generate it?

$
0
0

@temohpab wrote:

I’m trying to generate the icons needed to send the app to revision… But it’s necessary send with some specific dimensions.

How can I achieve this quickly? Because in the Mac I don’t have installed photoshop and I cannot use the screenshots from the emulator because are too small.

Thanks

Posts: 1

Participants: 1

Read full topic


OneSignal Web Push stopped working?

$
0
0

@Dunny wrote:

Hi,

So this was working fine and after and Ionic 3 version update, I’m getting the below error,

ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'OneSignal' of undefined

I have the below in my index.html,

 <!-- un-comment this code to enable web push -->
  <script src="https://cdn.onesignal.com/sdks/OneSignalSDK.js" async='async'></script>
  <script>
    var OneSignal = window.OneSignal || [];
  </script>
  <!-- -->

and then I init it as below to try to obtain my playerId.

initWebPush()
{
  var that = this;

  this.OneSignal = window["OneSignal"];
  this.oneSignalId = "";


  this.OneSignal.push(["init", {
    appId: "xxxxxxx-xxxx-xxxxxx-xxxxxxx",
    autoRegister: true,
    httpPermissionRequest: {
      enable: true
    },
    welcomeNotification: {
      disable: true
    },
    notifyButton: {
      enable: false
    },
    promptOptions: {
      siteName: 'Push Notifications',
      actionMessage: "Please Allow Push Notifications.",
      exampleNotificationTitle: 'Holiday Approved',
      exampleNotificationMessage: 'Your holiday request was approved.',
      exampleNotificationCaption: 'You can unsubscribe at anytime.',
      acceptButtonText: "ALLOW",
      cancelButtonText: "NO THANKS"
  }
  }]);


  this.OneSignal.push(function () {
    this.OneSignal.isPushNotificationsEnabled(function (isEnabled) {

      if (!isEnabled) {
        this.OneSignal.push(function () {
          this.OneSignal.registerForPushNotifications({
            modalPrompt: true
          });
        });
      }
      else {
        this.OneSignal.push(function () {
          this.OneSignal.getUserId().then(function (userId) {
            that.oneSignalId = userId;
          });
        });
      }
    });
  });


  this.OneSignal.push(function () {
    this.OneSignal.on('subscriptionChange', function (isSubscribed) {
      if (isSubscribed) {
        this.OneSignal.getUserId().then(function (userId) {
          that.oneSignalId = userId;
        });
      }
      else {
        that.oneSignalId = "";
      }
    });
  });


  this.OneSignal.on('notificationDisplay', function (event) {
    that.notificationDisplayed(event);
  });
}

The modal dialog still appears allowing me to enable notifications but it fails to get the User Id.

Any help appreciated.

Thanks.

Posts: 3

Participants: 2

Read full topic

Hiding the footer when the keyboard is shown

$
0
0

@Kingsanity wrote:

Hello,

I have read many threads about my issue but none of them seems to have the working solution.

I have an ion-footer element and want to hide this when I open the keyboard. Right now the footer will stick on top off the keyboard, blocking a part of the view. Does anyone have a working solution for Ionic 3?

Thanks in advance

Posts: 1

Participants: 1

Read full topic

Authentificating API

$
0
0

@khalilben wrote:

Hi,

I actually would have a login form using an laravel api, once connected it returns JSON data

{
id: 1,
group_id: 1,
username: "khalilben",
password: "CHIFFRED",
email: "mail@gmail.com",
first_name: "Khalil",
last_name: "Ben",
avatar: "1.jpg",
active: 1,
login_attempt: 12,
last_login: "2017-11-16 11:03:08",
created_at: "2014-03-12 09:18:46",
updated_at: "2017-11-13 16:29:10",
reminder: "CHIFFRED",
activation: null,
remember_token: "CHIFFRED",
last_activity: 1510833728
}

What i want to do is once it success, it send me to a profil page with those informations below. And save the ID globally to use it after on another page…
And don’t know how to proceed.
Already having this code but don’t know if it’s good and how to use it correctly

import { Injectable } from '@angular/core';
import { Http, Headers } from '@angular/http';
import 'rxjs/add/operator/map';

//https://www.djamware.com/post/58c1703e80aca7585c808ec1/step-by-step-tutorial-building-ionic-2-rest-api-authentication


//Providers
import {Resources} from  '../resources';
let apiUrl =Resources.Constants.API.api_login;
@Injectable()
export class AuthService {

  constructor(public http: Http) {
    console.log('Hello AuthService Provider');
  }

  login(credentials) {
    return new Promise((resolve, reject) => {
      let headers = new Headers();
      headers.append('Content-Type', 'application/json');

      this.http.post(apiUrl + 'login', JSON.stringify(credentials), { headers: headers })
        .subscribe(res => {
          resolve(res.json());
        }, (err) => {
          reject(err);
        });
    });
  }

  postData(credentials, type) {
    return new Promise((resolve, reject) => {
      let headers = new Headers();

      this.http.post(apiUrl + type, JSON.stringify(credentials), { headers: headers })
        .subscribe(res => {
          resolve(res.json());
        }, (err) => {
          reject(err);
        });
    });
  }

  logout() {
    return new Promise((resolve, reject) => {
      let headers = new Headers();
      headers.append('X-Auth-Token', localStorage.getItem('token'));

      this.http.post(apiUrl + 'logout', {}, { headers: headers })
        .subscribe(res => {
          localStorage.clear();
        }, (err) => {
          reject(err);
        });
    });
  }
}

Posts: 1

Participants: 1

Read full topic

Cordova not avaliable

$
0
0

@navaneethan111 wrote:

Hi,
I am new for ionic and i am creating mobile app using cordova +anjular+ionic .For that i using sqllite to connecting database during this time "CORODOVA not available" this error showing pls help me
below my code:

Database.ts
import { Injectable } from ‘@angular/core’;
import { Platform } from ‘ionic-angular’;
import { SQLite, SQLiteObject } from ‘@ionic-native/sqlite’;
import { SQLitePorter } from ‘@ionic-native/sqlite-porter’;
import { Http } from ‘@angular/http’;
import ‘rxjs/add/operator/map’;
import { BehaviorSubject } from ‘rxjs/Rx’;
import { Storage } from ‘@ionic/storage’;

/*
Generated class for the DatabaseProvider provider.

See https://angular.io/guide/dependency-injection for more info on providers
and Angular DI.
*/
@Injectable()
export class DatabaseProvider {
ready: Promise;
database: SQLiteObject;
private databaseReady: BehaviorSubject;

constructor(public sqlitePorter: SQLitePorter, private storage: Storage, private sqlite: SQLite, private platform: Platform, private http: Http) {
this.databaseReady = new BehaviorSubject(false);
this.platform.ready().then(() => {
this.sqlite.create({
name: ‘developers.db’,
location: ‘default’
})
.then((db: SQLiteObject) => {
this.database = db;
this.storage.get(‘database_filled’).then(val => {
if (val) {
this.databaseReady.next(true);
} else {
this.fillDatabase();
}
});
});
});
}

fillDatabase() {
this.http.get(‘assets/icon/main.sql’)
.map(res => res.text())
.subscribe(sql => {
this.sqlitePorter.importSqlToDb(this.database, sql)
.then(data => {
this.databaseReady.next(true);
this.storage.set(‘database_filled’, true);
})
.catch(e => console.error(e));
});
}

addDeveloper(name, skill, years) {
let data = [name, skill, years]
return this.database.executeSql(“INSERT INTO developer (name, skill, yearsOfExperience) VALUES (?, ?, ?)”, data).then(data => {
return data;
}, err => {
console.log('Error: ', err);
return err;
});
}

getAllDevelopers() {
return this.database.executeSql(“SELECT * FROM developer”, []).then((data) => {
let developers = [];
if (data.rows.length > 0) {
for (var i = 0; i < data.rows.length; i++) {
developers.push({ name: data.rows.item(i).name, skill: data.rows.item(i).skill, yearsOfExperience: data.rows.item(i).yearsOfExperience });
}
}
return developers;
}, err => {
console.log('Error: ', err);
return [];
});
}

getDatabaseState() {
return this.databaseReady.asObservable();
}
}

Home.ts

export class HomePage {

developer = {};
developers = [];

constructor(public navCtrl: NavController,public app:App, private databaseprovider: DatabaseProvider, private platform: Platform) {
// this.databaseprovider.getDatabaseState().subscribe(rdy => {
// if (rdy) {
// this.loadDeveloperData();
// }
// })
}

loadDeveloperData() {
this.databaseprovider.getAllDevelopers().then(data => {
this.developers = data;
})
}

addDeveloper() {
this.databaseprovider.addDeveloper(this.developer[‘name’], this.developer[‘skill’], parseInt(this.developer[‘yearsOfExperience’]))
.then(data => {
this.loadDeveloperData();
});
this.developer = {};
}

logout(){
// Remove API token
const root = this.app.getRootNav();
root.popToRoot();
}

My error
image

Posts: 1

Participants: 1

Read full topic

Error with image redirection only iOS

Update side menu after reading value from storage

$
0
0

@awadoodraj wrote:

in app.component.ts, i have a variable userRating:number = 1; its value is read from storage. the side menu does not show the value read from storage. instead, it shows default value i.e. 1. I can understand how it is happening but i don’t know how to ask side menu to update userRating? please help!

Posts: 1

Participants: 1

Read full topic

Ios: modal transition bug on devices 11.1.1

$
0
0

@pe1 wrote:

Hi, after updating my iPad to ios 11.1.1 I have noticed the bug when displaying modal pages, there are 2 phases when the modal is showing: the first short flash and the second normal modal view transition. The same when the modal window is hiding but reverse order: the normal transition to hide and then a short flash. Not sure you can see this effect on uploaded Conference App movie but it is very annoying in the real app. There is no such effect in the previous ios 11.0.2

cli packages: (/usr/local/lib/node_modules)

    @ionic/cli-utils  : 1.18.0
    ionic (Ionic CLI) : 3.18.0

global packages:

    cordova (Cordova CLI) : 7.1.0

local packages:

    @ionic/app-scripts : 3.1.0
    Cordova Platforms  : ios 4.5.3
    Ionic Framework    : ionic-angular 3.9.2

System:

    ios-deploy : 1.9.2
    ios-sim    : 5.0.13
    Node       : v6.10.0
    npm        : 3.10.10
    OS         : macOS High Sierra
    Xcode      : Xcode 9.1 Build version 9B55

Posts: 1

Participants: 1

Read full topic


Ionic + PHP + CORS

$
0
0

@adnanu wrote:

My Home.html is


<ion-header>
  <ion-navbar>
     <ion-title>
        My Favourite Technologies
     </ion-title>
  </ion-navbar>
</ion-header>

<ion-content padding>

  <ion-item>
    <button class="add" ion-button item-right icon-right margin-bottom color="primary"(click)="addEntry()">
      Add a technology
      <ion-icon name="add"></ion-icon>
    </button>
  </ion-item>


  <ion-item *ngFor="let item of items">
     <h2>{{ item.name }} </h2>
     <button ion-button color="primary" item-right (click)="viewEntry({ record: item })">View</button>
  </ion-item>

</ion-content>


Home.ts

import { AddTechnologyPage } from './../add-technology/add-technology';
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';

import { Http } from '@angular/http';
import 'rxjs/add/operator/map';

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {

   public items : any = [];

   constructor(public navCtrl: NavController, public http: Http) {

   }


   ionViewWillEnter() {
      this.load();
   }

   // Retrieve the JSON encoded data from the remote server
   // Using Angular's Http class and an Observable - then
   // assign this to the items array for rendering to the HTML template
   load() {
      this.http.get('http://localhost:8080/ionic/retrieve-data.php').map(res => res.json()).subscribe(data => {
         this.items = data;
      });
   }


   // Allow navigation to the AddTechnology page for creating a new entry
   addEntry() {
      this.navCtrl.push(AddTechnologyPage);
   }


   // Allow navigation to the AddTechnology page for amending an existing entry
   // (We supply the actual record to be amended, as this method's parameter,
   // to the AddTechnology page
   viewEntry(param) {
      this.navCtrl.push(AddTechnologyPage, param);
   }


}

Posts: 3

Participants: 3

Read full topic

How to use textarea ngModel and default value?

$
0
0

@tallgotte wrote:

I am new in ionic and have a problem with textarea. This is my code:

<textarea [(ngModel)]=“userData.aboutme” name="" id="" cols=“30” rows=“20” value="{{ about_me}}" style=“width:100%; padding: 10px; margin-top: 3px;” >

The problem is that the value is not showing inside textarea. It’s show only if i remove the [(ngModel)]. I need help for this thanks a lot

Posts: 1

Participants: 1

Read full topic

Promises - Firebase Auth

$
0
0

@TiTiTools wrote:

Dear friends, greetings to all!!

I’m Pedro, a new kind of programmer…

I’m trying to sync asyncronous callings to do a google authentication, but it’s not following the supposed order (and I’m getting crazy). It’s getting doing login, but not in the correct order…

Can anybody help me, pleeeeasee??

This is the main code:

this.authProvider.getGoogleLoginCredential()
  .then(() => {
    console.log("1: entering firebaseAuthentication");
    this.authProvider.firebaseAuthentication();
    console.log("3: exiting firebaseAuthentication");
  }).then(() => {
    console.log("entering getUser().uid");
    this.authProvider.getUser().uid;
  }).then(() => {

Here authProvider where methods are called:

public firebaseAuthentication(): Promise {
return this.afAuth.auth.signInWithCredential(this.credential)
.then((success) => {
console.log('2: Firebase Authentication success: ’ + JSON.stringify(success));
})
}

getGoogleLoginCredential(): Promise {
return this.googlePlus.login({
webClientId:
xyxy.apps.googleusercontent.com
, offline: false
}).then(res => {
this.googleLoginData = (res);
console.log(this.googleLoginData);
this.credential = firebase.auth.GoogleAuthProvider.credential(
res.idToken
);
console.log(this.credential);
}
).catch(err => console.error(err));
}

And here is the result:
1: entering firebaseAuthentication
modal-login.ts:63
3: exiting firebaseAuthentication
modal-login.ts:65
entering getUser().uid

TypeError: Cannot read property ‘uid’ of null
at modal-login.ts:66
at t.invoke (polyfills.js:3)
at Object.onInvoke (core.es5.js:3890)

modal-login.ts:68
2: Firebase Authentication success: {“uid”:"RIvKWOi … }

Posts: 1

Participants: 1

Read full topic

ERROR CONTEXT DebugContext_

App restarts whenever it goes to background

$
0
0

@rubenfig wrote:

Mi app keeps restarting to splash screen and login page when i send it to background. Any ideas about why this is happening? Do i have to manually catch all pause and resume events?

Posts: 1

Participants: 1

Read full topic

Ionic loading controller - using function to hide and show not settimeout

$
0
0

@champion007 wrote:

Folks, I need something like hideloader() and showloader() which should work across the file not with setTimeOut .

Suggest something more of ionic style.

Posts: 1

Participants: 1

Read full topic

Error build windows phone

$
0
0

@GustavoSanDiego wrote:

When I add the windows platform it gives me this error:

Error: Cannot read property ‘targetProject’ of null

Someone has an idea of ​​why it can be?

Posts: 1

Participants: 1

Read full topic


Issues with ionic slides

$
0
0

@insightmichael wrote:

I have an issue with the slides

Originally my mark up was

<div id="slide-container">
<ion-slides autoplay="3000" loop="true" effect="fade">
<ion-slide *ngFor="let  g of sponsorGraphicsArr">
    <div *ngIf="g['iphone5GraphicURL'] && !platform.is('tablet')" class="home-bg" [style.backgroundImage]="'url(' + serverName + g['iphone5GraphicURL'] + ')' | safe: 'style'" id="background-image"></div>
    <div *ngIf="g['ipadProGraphicURL'] && platform.is('tablet')" class="home-bg" [style.backgroundImage]="'url(' + serverName + g['ipadProGraphicURL'] + ')' | safe: 'style'" id="background-image"></div>
</ion-slide>
</ion-slides>
</div>

The last slide would play twice in the loop.

(Also the second slide would pass very quickly).

Then I tried disabling the input parameters and doing it in the controller.

ngAfterViewInit(){
            setTimeout(() => {
            this.sliderIni();
            },1000)

    }

    sliderIni(){
       this.slides.effect='fade';
       this.loopSlider();
    }

    public async loopSlider() {
    let i = 0;
    while (i <= this.sponsorGraphicsArr.length) {
       await new Promise<void>(resolve => {
           setTimeout(resolve, this.sliderDelay);
       });
       this.changeSlide();
    }
    console.log('done');
}

    public changeSlide(): void {

          if(this.slides.isEnd()) {
                this.slides.slideTo(0, 300)
          }else{
               this.slides.slideNext(300);
          }
    }

This works better than the slider out of the box in that it doesn’t play the last slide twice and all the slides are evenly timed. However there is no fade effect for slideTo and slideNext.

If the first issue can be solved this would be good if not I may abandon using this plugin in favour of something custom. Any help appreciated.

Posts: 1

Participants: 1

Read full topic

So much time between splash and the app running

$
0
0

@carloscruz85 wrote:

Hi, when I run the app, after the splash , take so much time with a white screen ¿There are a way or trick to show some text or image while app run?

Posts: 1

Participants: 1

Read full topic

OpaqueToken error in vendor.js

$
0
0

@wterrill wrote:

I’ve been trying to update a program from ionic 2.0.1 to ionic 3 (angular 5) and I’m running into something that I’ve had little luck finding online.

Basically, when I run ‘ionic serve’ I get the following error -
WEBPACK_IMPORTED_MODULE_0__angular_core.OpaqueToken is not a constructor

and it’s coming from vendor.js (which is added to the project in the index.html file)

I did see from the angular upgrade site that all OpaqueTokens should be replaced by InjectTokens, and I tried to do directly in vendor.js… but it seems that vendor.js is created during ionic serve, so all of the changes I made are overwritten.

After reading a bunch about webpack, I imagine that the problem is that I have an import of Angular core somewhere that shouldn’t be there… but I’m unsure of what to search for. (especially because I have “@angular/core”: “5.0.1”, in my package.json file. I’m just not sure what to get rid of.

Here’s the rest of my package.json file… if it helps:

{
“name”: “neighborly_test”,
“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": “5.0.1”,
"@angular/compiler": “5.0.1”,
"@angular/compiler-cli": “5.0.1”,
"@angular/core": “5.0.1”,
"@angular/forms": “5.0.1”,
"@angular/http": “5.0.1”,
"@angular/platform-browser": “5.0.1”,
"@angular/platform-browser-dynamic": “5.0.1”,
"@ionic-native/app-version": “^4.4.0”,
"@ionic-native/badge": “^4.4.0”,
"@ionic-native/core": “4.4.0”,
"@ionic-native/splash-screen": “4.4.0”,
"@ionic-native/status-bar": “4.4.0”,
"@ionic/storage": “2.1.3”,
“angularfire2”: “^2.0.0-beta.8”,
“gsap”: “^1.19.1”,
“ionic-angular”: “3.9.2”,
“ionicons”: “3.0.0”,
“moment”: “^2.18.1”,
“rxjs”: “5.5.2”,
“sw-toolbox”: “3.6.0”,
“zone.js”: “0.8.18”
},
“devDependencies”: {
"@ionic/app-scripts": “3.1.2”,
“typescript”: “2.4.2”
},
“description”: “An Ionic project”,
“cordova”: {
“plugins”: {
“cordova-plugin-app-version”: {},
“cordova-plugin-badge”: {}
}
}
}

Posts: 1

Participants: 1

Read full topic

Ionic Firebase Authentication

$
0
0

@Horpey wrote:

No matter the email address and password being inputed still leads to homepage… When registered it receives the email and stores it but when used it in sign in( using a wrong Password still works, leading to the homepage but later displays the error that its incorrect

Posts: 1

Participants: 1

Read full topic

I need to print console from the firebase data

$
0
0

@usufalrais wrote:

Hi,
I am new to ionic 3 and just started with backend process. i need to print value of various parameter in console using this am getting key value. i need to fetch data inside the key. thanks in advance
this.TaskList$ = this.taskls.getItemList().snapshotChanges().map(
changes => {
return changes.map(c => ({
key: c.payload.key, …c.payload.val(),

    })

    );

Posts: 1

Participants: 1

Read full topic

Viewing all 49085 articles
Browse latest View live


<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>