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

In Ionic Ion-segment-button

$
0
0

@aarthisippailab wrote:

In first view,the segment Value(Thismonth) shows empty space.if we click that empty space its shows the segment value as (Thisyear).

For example
Today,This Month,This year

Screenshot


Getting error like this…

code

 <div padding>
      <ion-segment [(ngModel)]="attendance" (ionChange)="updatePage(attendance)">
        <ion-segment-button value="Today">
          Today
        </ion-segment-button>
        <ion-segment-button value="Thismonth">
          This Month
        </ion-segment-button>
        <ion-segment-button value="Thisyear">
          This Year
        </ion-segment-button>
      </ion-segment>
    </div>

Posts: 2

Participants: 2

Read full topic


Error in cordova local notification

Help me Error with sqllite

$
0
0

@nguyentrunghieutcu wrote:

insert(table,data,callback){
    let keys = Object.keys(data);
    //INSERT INTO domain (id, api_url, company,domain,email,site_logo) VALUES (?, ?, ?, ?, ?, ?)"
    let paras = "?,".repeat(keys.length);
    paras = paras.substr(0,paras.length -1);

    let sql = "INSERT INTO " + table + "(" + keys.join() + ") VALUES (" + paras +")" ;
    return this.database.executeSql(sql,data).then(data =>{
      callback(null,data);
    },err =>{
      callback(err);
    })
  }

ERROR :slight_smile:

ERROR TypeError: Cannot read property 'executeSql' of undefined
    at DatabaseProvider.webpackJsonp.148.DatabaseProvider.insert (database.ts:78)
    at SafeSubscriber._next (domain.ts:31)
    at SafeSubscriber.__tryOrUnsub (Subscriber.js:238)
    at SafeSubscriber.next (Subscriber.js:185)
    at Subscriber._next (Subscriber.js:125)
    at Subscriber.next (Subscriber.js:89)
    at MapSubscriber._next (map.js:85)
    at MapSubscriber.Subscriber.next (Subscriber.js:89)
    at XMLHttpRequest.onLoad (http.js:1556)
    at t.invokeTask (polyfills.js:3)

Posts: 1

Participants: 1

Read full topic

Ionic Tab Index Not Update

$
0
0

@rodrigosoaresc wrote:

Hi,
I’m trying to change an ionic tab from the TS code using something like:

var t: Tabs = this.navCtrl.parent;
t.select(1);

On my html I have:
<ion-tabs [selectedIndex]=“tabIndex” (ionChange)=“tabChange($event)”>

The problem is on tabChange function, the Tab object received has an index different of tabIndex variable. Why this is happening?

Thank you

Posts: 1

Participants: 1

Read full topic

Go to a specific page when clicking on a notification

$
0
0

@Faizyfaazz wrote:

How to go to a specific page when clicking on a notification?
I used like this, but it didn’t work

  fcm.onNotification().subscribe(data=>{
      if(data.wasTapped){
    this.navcntrl.push(MessagePage); 
      };
    })

how i can do it correctly?

Posts: 2

Participants: 2

Read full topic

Is there anyway to hide tooltips on page scroll?

Google Map Marker can be seen in browser but not in android

$
0
0

@iamlalai wrote:

I’m using Ionic 3. I tried running my app in the browser and the markers can be seen. When I run it in my android device, only the current location was marker-ed. Any answers why it wasn’t found in my android device?

   displayGoogleMap() {


    //get current location
    this.geolocation.getCurrentPosition().then((resp) => {


      let latLng = new google.maps.LatLng(resp.coords.latitude, resp.coords.longitude);

      let mapOptions = {
        center: latLng,
        zoom: 15,
        mapTypeId: google.maps.MapTypeId.ROADMAP
      };

      this.map = new google.maps.Map(this.mapContainer.nativeElement, mapOptions);
      let marker = new google.maps.Marker({
        map: this.map,
        animation: google.maps.Animation.DROP,
        position: latLng
      });
      this.addInfoWindow(marker, 'Current Location');


    }).catch((error) => {
      console.log('Error getting location', error);
    });

my displayGoogleMap() works but when I’ll add multiple markes, it doesn’t appear already.

 addMarkersToMap(bank) {

      console.log('bank: '+bank['id']+'lat: '+bank['address']['latitude']+' longi: '+bank['address']['longitude']);

      let position = new google.maps.LatLng(bank['address']['latitude'], bank['address']['longitude']);

      let mapOptions = {
        center: position,
        zoom: 15,
        mapTypeId: google.maps.MapTypeId.ROADMAP
      };

      this.map = new google.maps.Map(this.mapContainer.nativeElement, mapOptions);
      let marker = new google.maps.Marker({
        map: this.map,
        animation: google.maps.Animation.DROP,
        position: position
      });
      this.addInfoWindow(marker, bank['institution']);


  }

  addInfoWindow(marker, content){
    let infoWindow = new google.maps.InfoWindow({
      content: content
    });
    google.maps.event.addListener(marker, 'click', () => {
      infoWindow.open(this.map, marker);
    });
  }

  retrieveBloodBanks(){

    var secret='aaaaaaaaaaaa';

      // return new Promise(resolve => {

      this.http.get('http://asdfghjk.aaa.aa.aa/api/institutions?secret='+secret)
        .map(res => res.json())
        .subscribe(data => {

          this.bankList = data;
          console.log( 'rtvr bank:  '+this.bankList);

          for (let bank of this.bankList['institutions']) {
              console.log(bank['id']);
              this.addMarkersToMap(bank);
          }

        });
      // });
  }

You’re a big help to my thesis if you could help me.

}

Posts: 1

Participants: 1

Read full topic

Ionic3 - ios - Access-Control-Allow-Origin error

$
0
0

@denkedani wrote:

We are building an application based on a simple login,registration function in the beginning of the app.
We’ve changed the server protocol to https from http because of social media restrictions and requirements.
Now the server not allows the app the communicate with it, the only option that was successful is to set the whole apache servers header to enable calls from all origins, wich is a huge security risk.

Can anybody help me, us with a workaround, solution or anything?

Thank you very much!
Daniel

Posts: 1

Participants: 1

Read full topic


Ion-List 'underlapping' ion-tabs and ion-nav

$
0
0

@leoneltasso wrote:

In my home page i have a ion-list, sometime(yes, not every time), when i select a object in this list or go to the register page, through the “this.app.getRootNav().push(“ClienteCadastroPage”)”, and select a input in registerPage ou descriptionPage, and use “this.navCtrl.pop();” to comeback, my ion-list is under the Ion-Tab and Ion-nav

1- Ion-List:

2 - After i select a item, i touch in any input

3- After i select to comeback or save !

As you can see in the last pic the ion-list is under the other elements.

Posts: 1

Participants: 1

Read full topic

Not building android-armv7.debug.apk

$
0
0

@prasanna-chadaram wrote:

When I am building apk. It is building the only debug.apk. But it is not installing in mobile. Please help me build android-armv7.debug.apk. So, I can install it on mobile.
Thanks in Advance

Posts: 1

Participants: 1

Read full topic

Http Post Array in Ionic 3 - SQLite - Angular 4

$
0
0

@zergiok wrote:

I’m trying to post array of contactos on a WebService.
When send the array this data appears in NULL in WebService.
I’m confused with Let params{}
The error is object undefinded.
And the method POST doesn´t works.

This is my home.ts

    postRequest(){
            this.sqlite.create({
            name: 'ionicdb.db',
            location: 'default'
        }).then((db: SQLiteObject) =>{
          db.executeSql('SELECT * FROM Contactos ORDER BY rowid DESC', {})
          .then(result =>  {
            this.contactos = [];
            for(var i=0; i<result.rows.length; i++) {
              this.contactos.push({
                rowid:result.rows.item(i).rowid,
                nombre:result.rows.item(i).nombre,
                telefono:result.rows.item(i).telefono,
                ext:result.rows.item(i).ext,
                correo:result.rows.item(i).correo,
                empresa:result.rows.item(i).empresa})  

                var headers = new Headers();
                headers.append("Accept", 'application/json');
                headers.append('Content-Type', 'application/x-www-form-urlencoded');
                let options = new RequestOptions({ headers: headers });
                let params = { 
                  nombre: 'Sergio',
                  telefono: '1234567',
                  ext: '000',
                  correo: 'zergiodkamargo.sc@gmail.com',
                  empresa: 'Globaltek'
            }

             this.http.post("http://181.48.244.108/FeriaDutotec/api/Contactos1", JSON.stringify(params), options)
            .subscribe(contactos => {
            this.contactos.push(contactos.json())
            console.log(contactos ['_body']);
            this.toast.show('Datos Sincronizados!' , '4000', 'center').subscribe(
              toast => {
                console.log(contactos);
              }
            )
            }, error => {
            console.log(error.message);// Error obteniendo los datos!
            this.toast.show('Error en la sincronizacion!'+ error.message, '4000' , 'center').subscribe(
              toast => {
                console.log(toast);
              }
              )
              }); 
}  
    console.log('Result')
    })
    .catch(e => console.log(e));
    console.log('Create')
    }) 
    .catch(e => console.log(e));
    }

Posts: 2

Participants: 2

Read full topic

Navbar Styling Issue

$
0
0

@jbreed wrote:

After doing updates and modifications to my code I now notice my styling applied to the narbar is no longer being shown. This appears to show across the whole application. Not seeing any errors when kicking off ionic serve either. Normally, the title is displayed in center, buttons are formatted differently, etc. It appears that CSS isn’t being applied to these navbar sections. It is the same across the whole application. I began to move to try it on my device using android run, but am getting some errors there as well. I thought possibly an update broke this, but if so my last backup contains the same issue. No errors are shown in the console.

Any suggestions?

headerimg

<ion-header>

  <ion-navbar>
    <ion-title>League1</ion-title>
	  <ion-buttons end>
		<button ion-button icon-only (tap)='inviteContacts()'>
			<ion-icon name="person-add"></ion-icon>
		</button>
	  </ion-buttons>
  </ion-navbar>

</ion-header>

cli packages: (C:\Users\justin\AppData\Roaming\npm\node_modules)

@ionic/cli-utils  : 1.19.1
ionic (Ionic CLI) : 3.19.1

global packages:

cordova (Cordova CLI) : 8.0.0

local packages:

@ionic/app-scripts : 3.1.8
Cordova Platforms  : android 7.0.0
Ionic Framework    : ionic-angular 3.9.2

System:

Android SDK Tools : 26.1.1
Node              : v8.9.1
npm               : 5.5.1
OS                : Windows 10

Environment Variables:

ANDROID_HOME : C:\Users\justin\AppData\Local\Android\Sdk

Misc:

backend : pro

[10:21:51] watch started …
[10:21:51] build dev started …
[10:21:51] clean started …
[10:21:51] clean finished in 14 ms
[10:21:51] copy started …
[10:21:52] deeplinks started …
[10:21:52] deeplinks finished in 163 ms
[10:21:52] transpile started …
[10:21:55] transpile finished in 3.75 s
[10:21:55] preprocess started …
[10:21:55] preprocess finished in 1 ms
[10:21:55] webpack started …
[10:21:56] copy finished in 4.15 s
[10:22:01] webpack finished in 5.13 s
[10:22:01] sass started …
Without from option PostCSS could generate wrong source map and will not find Browserslist config. Set it to CSS file path or to undefined to prevent this warning.
[10:22:02] sass finished in 1.15 s
[10:22:02] postprocess started …
[10:22:02] postprocess finished in 11 ms
[10:22:02] lint started …
[10:22:02] build dev finished in 10.46 s
[10:22:02] watch ready in 10.60 s
[10:22:02] dev server running: http://localhost:8100/

[OK] Development server running!

Posts: 1

Participants: 1

Read full topic

Track User Velocity

$
0
0

@jicee13 wrote:

Hello,

I’m making an app where one of the main functionalities is going to be tracking the speed of the the user, like a GPS speedometer basically. Any suggestions on how I can do this? Or which plugins I need to use?

Posts: 1

Participants: 1

Read full topic

Barcode scanner code

$
0
0

@rsaurabh79 wrote:

Hii guys please send me barcode scanner code its urgent, I have tried lots of code but it didn’t work

Posts: 1

Participants: 1

Read full topic

How to use NFC plugin

$
0
0

@Astrix wrote:

Hi!
I really need your help with this one!
I’m interested in using the phonegap NFC plugin.

I’ve tried everything i could, yet i cannot seem to work this one out.

What I need is a simple working example:
-a button, which on click fires up the nfc chip and sends a “Hello world!” to the other 'android device - and let’s say it beeps on success
-this button also has a addNdefListener action that let’s say gets the hello world and prints it out

Thanks in advance!
Astrix

Posts: 1

Participants: 1

Read full topic


Ionic 3 / Cordova : Build an app which being supported by all android versions from 2.0 to 7.0

$
0
0

@garalimedkarim wrote:

I start developping with Ionic, so I installed the lastest versions of Ionic and Cordova.

Cordova : 8.0.0
Ionic : 3.19.1
In the Cordova Documentation there is a mapping between cordova versions and android API Levels:

cordova | API-Levels| Equivalent Android Version
6.X.X | 16 - 25 | 4.1 - 7.1.1
5.X.X | 14 - 23 | 4.0 - 6.0.1
4.1.X | 14 - 22 | 4.0 - 5.1
4.0.X | 10 - 22 | 2.3.3 - 5.1
3.7.X | 10 - 21 | 2.3.3 - 5.0.2
Documentation Link: https://cordova.apache.org/docs/en/latest/guide/platforms/android/index.html

When I start to test my first App in the different android version,

Android 5 : OK

Android 2.3 : NOK (Error in Android Studio when running the app in my real device : the minSdk supported = 16 > your device sdk (10)

So I’m asking if want that my application been supported by all android versions from android 2.0.0 to android 7.0.0, What I have to do ?

Thank you for your support

Posts: 1

Participants: 1

Read full topic

Http Post Array in Ionic 3 - SQLite - Angular 4

$
0
0

@zergiok wrote:

I’m trying to post array of contactos on a WebService.
When send the array this data appears in NULL in WebService.
I’m confused with Let params{}
The error is object undefinded.
And the method POST doesn´t works.

This is my home.ts

    postRequest(){
            this.sqlite.create({
            name: 'ionicdb.db',
            location: 'default'
        }).then((db: SQLiteObject) =>{
          db.executeSql('SELECT * FROM Contactos ORDER BY rowid DESC', {})
          .then(result =>  {
            this.contactos = [];
            for(var i=0; i<result.rows.length; i++) {
              this.contactos.push({
                rowid:result.rows.item(i).rowid,
                nombre:result.rows.item(i).nombre,
                telefono:result.rows.item(i).telefono,
                ext:result.rows.item(i).ext,
                correo:result.rows.item(i).correo,
                empresa:result.rows.item(i).empresa})  

                var headers = new Headers();
                headers.append("Accept", 'application/json');
                headers.append('Content-Type', 'application/x-www-form-urlencoded');
                let options = new RequestOptions({ headers: headers });
                let params = { 
                  nombre: 'Sergio',
                  telefono: '1234567',
                  ext: '000',
                  correo: 'zergiodkamargo.sc@gmail.com',
                  empresa: 'Globaltek'
            }

             this.http.post("http://181.48.244.108/FeriaDutotec/api/Contactos1", JSON.stringify(params), options)
            .subscribe(contactos => {
            this.contactos.push(contactos.json())
            console.log(contactos ['_body']);
            this.toast.show('Datos Sincronizados!' , '4000', 'center').subscribe(
              toast => {
                console.log(contactos);
              }
            )
            }, error => {
            console.log(error.message);// Error obteniendo los datos!
            this.toast.show('Error en la sincronizacion!'+ error.message, '4000' , 'center').subscribe(
              toast => {
                console.log(toast);
              }
              )
              }); 
}  
    console.log('Result')
    })
    .catch(e => console.log(e));
    console.log('Create')
    }) 
    .catch(e => console.log(e));
    }

Posts: 4

Participants: 2

Read full topic

Best way to navigate to shared component from lazy loaded page?

$
0
0

@ghostrunners wrote:

I am trying to navigate to a shared component from a lazy loaded page, and I keep running into the

Uncaught (in promise): Error: No component factory found for InfoComponent. Did you add it to @NgModule.entryComponents?
Error: No component factory found for InfoComponent. Did you add it to @NgModule.entryComponents?
    at noComponentFactoryError (http://localhost:8100/build/vendor.js:3559:34)

error. I’ve pasted the shared component module.ts, and the lazy loaded pages module.ts + ts file which imports a component from the shared ones.

SHARED COMPONENT

import { NgModule } from '@angular/core';
import { InfoComponent } from './info/info';
import { PersonalInfoComponent } from './personal-info/personal-info';
import { PersonalStatementComponent } from './personal-statement/personal-statement';
import { CitizenshipInfoComponent } from './citizenship-info/citizenship-info';
import { EmploymentComponent } from './employment/employment';
import { EducationComponent } from './education/education';

import { IonicModule } from 'ionic-angular';

@NgModule({
    imports: [IonicModule],

    declarations: [InfoComponent,
    PersonalInfoComponent,
    PersonalStatementComponent,
    CitizenshipInfoComponent,
    EmploymentComponent,
    EducationComponent],

    exports: [InfoComponent,
    PersonalInfoComponent,
    PersonalStatementComponent,
    CitizenshipInfoComponent,
    EmploymentComponent,
    EducationComponent],

    entryComponents: [InfoComponent,
    PersonalInfoComponent,
    PersonalStatementComponent,
    CitizenshipInfoComponent,
    EmploymentComponent,
    EducationComponent],

})

export class TuitionReclassificationComponentsModule {}

LAZY LOADED module.ts

import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { TuitionReclassificationPage } from './tuition-reclassification';
import { TuitionReclassificationComponentsModule } from './components/tuition-reclassification-components.module';

@NgModule({
  declarations: [ 
    TuitionReclassificationPage,
  ],
  imports: [
    TuitionReclassificationComponentsModule,
    IonicPageModule.forChild(TuitionReclassificationPage)
  ],
  exports: [
TuitionReclassificationPage
  ]
})
export class TuitionReclassificationPageModule {}

LAZY LOADED PAGE

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { InfoComponent } from './components/info/info';

/**
 * Generated class for the TuitionReclassificationPage page.
 *
 * See https://ionicframework.com/docs/components/#navigation for more info on
 * Ionic pages and navigation.
 */

@IonicPage({
    name: 'rcb-petitition-ga-tuition-reclassification',
    segment: 'tuition-reclassification'
})
@Component({
  selector: 'page-tuition-reclassification',
  templateUrl: 'tuition-reclassification.html',
})
export class TuitionReclassificationPage {

     public rootPage: any = InfoComponent;

  constructor(public navCtrl: NavController, public navParams: NavParams) {
  }

  ionViewDidLoad() {
    console.log('ionViewDidLoad TuitionReclassificationPage');
  }

}

Posts: 1

Participants: 1

Read full topic

AdMob Rewarded Video message on close video

$
0
0

@NurGuz wrote:

Implementing AdMob Rewarded Video Ads for Android I see that when a user closes the ad before the reward is achieved the following message in the image is show. Does anyone know if it is possible to change that message? For example, “You won’t earn 30 coins” instead of You will lose your reward"

Posts: 1

Participants: 1

Read full topic

Secure file transfer from Ionic to (AWS EC2) server

$
0
0

@AndrewGolf wrote:

I’m trying to transfer a file from an Ionic iOS app to an AWS EC2 server running CentOS. I want this to be a secure file transfer. Will this plugin https://ionicframework.com/docs/native/ftp/ create a secure connection? I would assume not, since FTP isn’t secure. But if the server uses https would that make the FTP upload secure? If not, is there a way to securely transfer a file from an ionic app to a server?

Posts: 2

Participants: 2

Read full topic

Viewing all 49348 articles
Browse latest View live


Latest Images

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