@coolestsumit wrote:

please let me know is ios app self-update is possible in ionic . if yes , then how…waiting for response… thanks in advance

Posts: 1

Participants: 1

Read full topic

@joseph7 wrote:

Hey guys,

I’ll be developing quiz-like game application in Ionic, and I have a few questions.

The application should have log-in capabilities, with friend list and of course database of questions.
Which services should I use? I have found this topic Backend for Quiz-App where the answer is to maybe use some PHP frameworks, but to be honest im not to keen with PHP.
What are my other options? Thank you in advance.

Kind Regards,
Filip

Posts: 1

Participants: 1

Read full topic

@abdul4 wrote:

Hello everyone. I’m currently working on mobile app using ionic, but recently I faced an obstacle.
1: Whenever I run the app on browser ionic serve --lab it runs perfectly.
2:When I run the application on android real device, it can’t open the app and sticks with the first view, and it never vanishes the default spinner, however while I debug the app using chrome://inspect, there it shows the login page.
I’m gonna provide some screen shots as well.

The app is runs on real device, but never shows this (login) page. However on chrome it works perfectly.

image.jpg1360×734 282 KB

This is the spinner page.

Screenshot_20190223-143327[1].png720×1280 44.7 KB

Here is my app.component.ts file. 
import { Component, ViewChild } from '@angular/core';
import { Nav, Platform } from 'ionic-angular';
import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';
import { Push, PushObject, PushOptions } from '@ionic-native/push';
import { Storage } from '@ionic/storage';
import { App } from 'ionic-angular';
import { HomePage } from '../pages/home/home';
import { ListPage } from '../pages/list/list';
import { AboutPage } from '../pages/about/about';
import { CartPage } from '../pages/cart/cart';
import { timer } from "rxjs/observable/timer";
import { LoginPage } from '../pages/loginPages/loginMainPage/login';

@Component({
  templateUrl: 'app.html'
})
export class MyApp {
  @ViewChild(Nav) nav: Nav;
  rootPage: any = LoginPage;
  showSplash = true;
  pages: Array<{ title: string, component: any, icon }>;
  sendGetRequest() {
    // ****** Pack the all return in the new promise ******
    return new Promise(async (resolve, reject) => {
      await this.storage.length().then(async (data) => {
        if (data >= 1) {
          console.log('There is one data');
          await this.storage.get('isLogined').then(value => {
            console.log('value is', value);
            // if (value) this.app.getActiveNav().setRoot(LoginPage);
          }
          );
          this.statusBar.styleDefault();
          this.splashScreen.hide();

        }
      }).catch((error) => {
        console.log('error while accessing isLogined \n' + error);
        reject(error);
      })
    });

  }

  constructor(private push: Push,
    public platform: Platform,
    public statusBar: StatusBar,
    public splashScreen: SplashScreen,
    public storage: Storage,
    public app: App) {
    console.log('The fist line of constructor ');
    this.platform.ready().then(async () => {


      timer(3000).subscribe(async () => {
        await this.sendGetRequest();

        this.showSplash = false;

      })

    })
  }
  ngOnInit() {
    console.log('ngOnInit');
    this.pushSetup();


    // used for an example of ngFor and navigation
    this.pages = [
      { title: 'خانه', component: HomePage, icon: 'home' },
      { title: 'پروفایل', component: ListPage, icon: 'person' },
      { title: 'سبد خرید', component: CartPage, icon: 'cart' },
      { title: 'درباره', component: AboutPage, icon: 'person' },

    ];

  }

  initializeApp() {
    this.platform.ready().then(() => {
      // Okay, so the platform is ready and our plugins are available.
      // Here you can do any higher level native things you might need.
      this.statusBar.styleDefault();
      this.splashScreen.hide();

      timer(3000).subscribe(() => this.showSplash = false)
    });
  }
  pushSetup() {

    // to check if we have permission

    this.push.hasPermission().then((res: any) => {
      if (res.isEnabled) { console.log('We have permission to send push notifications'); } else {
        console.log('We do not have permission to send push notifications');
      }
    });


    const options: PushOptions = {
      android: { senderID: "551951714209", },

      ios: { alert: 'true', badge: true, sound: 'false' },
    };

    const pushObject: PushObject = this.push.init(options);
    pushObject.on('notification').subscribe((notification: any) => console.log('Received a notification', notification));
    pushObject.on('registration').subscribe((registration: any) => console.log('Device registered', registration.registrationId));
    pushObject.on('error').subscribe(error => console.error('Error with Push plugin', error));
  }


}

Note: let me know if I need to upload more stuffs.

Posts: 1

Participants: 1

Read full topic

@lsantaniello wrote:

Hi All,
I have a strange issue with my published app. it seems that styles are no longer loaded. No release has been made.

The problem has beed replicated on Android device and Chrome browser. I think the problem is an chrome update.

Now I have the same problem on local machin (chrome browser only). I created a new page into my app and the problem persist.

<ion-header>
  <ion-navbar>
    <ion-title>Test</ion-title>
  </ion-navbar>
</ion-header>
<ion-content padding>
  <div class="test-luca">Ciao</div>
</ion-content>

page-test {
  .test-luca {
    color: red;
  }
}

2019-02-25_093906.png374×665 1.55 KB

ionic info

Ionic:

   ionic (Ionic CLI)  : 4.10.3 (C:\Users\xxx\AppData\Roaming\npm\node_modules\ionic)
   Ionic Framework    : ionic-angular 3.9.2
   @ionic/app-scripts : 3.1.9

Cordova:

   cordova (Cordova CLI) : 8.0.0
   Cordova Platforms     : android 7.0.0, browser 5.0.3, ios 4.5.4
   Cordova Plugins       : cordova-plugin-ionic-keyboard 2.0.5, cordova-plugin-ionic-webview 1.1.1, (and 8 other plugins)

System:

   Android SDK Tools : 26.1.1 (C:\Users\xxx\AppData\Local\Android\sdk)
   NodeJS            : v8.9.4 (C:\Program Files\nodejs\node.exe)
   npm               : 5.6.0
   OS                : Windows 10

Could you please help me?

Thanks
Luca

Posts: 1

Participants: 1

Read full topic

@jonmikelm wrote:

We are deveolping a new app using Ionic/angular 4.x and we are finding several problems related to form validation.

Ionic v4 components are supposed to implement the same behaviour as a vanilla HTML form input field in an angular app. It looks like ionic components try to apply an equivalent ion-*** class for each ng-*** class that angular applies to form elements.

We have verified that in most cases ionic component ion-*** classes are updated correctly at the same time as ng-*** classes when a form value changes. But if you use the angular forms “markAs***” functions to update the status of a form control, ion-*** classes are not updated.

We make heavy use of angular forms in our app and we are finding quite difficult to manage form control styling without using hacky workarrounds.

Is there anyone else experiencing these kind of problems?

Posts: 1

Participants: 1

Read full topic

@CreativeArtDesign wrote:

Will this work? in the in the global style ?

:root[dir="rtl"] {
  .my-header {
      font-size: 20px;
      font-family: arabic-font;
      padding:0px;
      color: #FFFFFF;
      background-color: #cccccc;
  }
}

:root[dir="ltr"] {
  .my-header {
      font-size: 20px;
      font-family: normal-font;
      padding:0px;
      color: #FFFFFF;
      background-color: #001b3c;
  }
}

Or is there other ways? to use two style css depends on RTL AND LTR?

Posts: 1

Participants: 1

Read full topic

@Dovel wrote:

How to set the Requires Android version in Play Store? It is always 4.4 for all Ionic Cordova Android Apps.

The preference android-minSdkVersion in config.xml is set to 22 (Android 5.1). Also android-targetSdkVersion has no effect. And I found nothing in the developer section of Play Store.

Posts: 1

Participants: 1

Read full topic

@Velmurugan wrote:

Hi ,

I am having the below code…

my Logged_user value is ‘9715328568’ which is taking from the local storage

if (this.logged_user ==undefined){                                        
  this.storage.get('username').then((auth) => {
    this.logged_user=auth;  
    console.log(this.logged_user,' is already  logged in '); //---- result '9715328568,' is already  logged in '
  });
  
  console.log(this.logged_user,' is already logged in signup screen');   //-- result undefined  is already logged in signup screen
  
}else{
  this.logged_user=this.logged_user
}

Outside of promise its shwing as indefined …
“console.log(this.logged_user,’ is already logged in signup screen’); //-- result undefined is already logged in signup screen”

Posts: 1

Participants: 1

Read full topic

@john33john33 wrote:

After setting back button text using config,
it does not reflect right away in nav bar.
Have to pop and push the page again.

playground:

you can see in contact page,
setting back button text does not reflect in self page and even in other nav stack

I suspect this is a bug and have opened a issue:

and find another issue similar:

is that a ionic bug / my program bug?
hope to see advice

Posts: 1

Participants: 1

Read full topic

@Anouar1911 wrote:

how can integret plugin bluetoothLE to connect to device that support BLE4.0

Posts: 1

Participants: 1

Read full topic

@victornoletosysout wrote:

I’m trying to set focus on an ion-searchbar, according to the documentation this is possible. The method “setFocus” is exactly what I’m looking for, however, that requires the input instance, which, from what I understand, is obtained by the “getInputElement” method - but here’s the question: how do I call this method to get this reference?

Posts: 1

Participants: 1

Read full topic

@harshm90 wrote:

I want to sum up all the prices when user select the checkbox

<ion-item no-lines *ngFor="let details of size;">
        <ion-checkbox item-left formControlName="size" (ionChange)="selectSize(details.size, $event)"></ion-checkbox>
        <ion-label>
          <ion-row>
            <ion-col col-6>
              <h5>{{details.size}}</h5> 
            </ion-col>
            <ion-col col-2>
              {{details.discounted_price_pretty}}
            </ion-col>
          </ion-row>
        </ion-label>
      </ion-item>

<ion-list *ngFor="let addon_cat of addon_cat">
        <ion-list-header>
          {{addon_cat.subcat_name}}
        </ion-list-header>
        <ion-item no-lines *ngFor="let addonitem of addon_subitem">
          <ion-checkbox item-left formControlName="addon" (ionChange)="selectAddon(addonitem.sub_item_name, $event)">
          </ion-checkbox>
          <ion-label style="font-size: 12px;">
            <ion-row>
              <ion-col col-8>
                <h5>{{addonitem.sub_item_name}}</h5>
                <p>{{addonitem.item_description}}</p>
              </ion-col>
              <ion-col col-4>
                <h5>{{addonitem.pretty_price}}</h5>
              </ion-col>
            </ion-row>
          </ion-label>
        </ion-item>
      </ion-list>

12312.png1264×695 108 KB

Any Help is highly appreciated

Posts: 1

Participants: 1

Read full topic

@coemaw wrote:

Hi , I would like to make wheel of fortune in Ionic.
May I know any plugin for it?

Posts: 1

Participants: 1

Read full topic

@pantarmj wrote:

In ionic3 when I push pageB on pageA and then come back to pageA, pageA was getting reloaded. But in ionic4 when I navigate back to previous page (from pageB to pageA), pageA is not getting reloaded i.e. constructor of pageA is not getting called. how to reload the previous page / component in this scenario? Some one plz help.

Posts: 1

Participants: 1

Read full topic

@Praveensb wrote:

constructor(public navCtrl: NavController, public navParams: NavParams,
public camera:Camera,public databaseProvider:DatabaseProvider,
public backgroundRun:BackgroundRun,public http:HttpClient,
public http2:Http,public diagnostic:Diagnostic,
private platform:Platform,
) {

this.platform.ready().then(() => {

  // this.diagnostic.isLocationAvailable().then( isAvailable => {
  //        console.log("Location available: " + isAvailable);
  // }).catch(error=>{

  //   console.log("Location");
  //   console.log(error);
  // });
  this.diagnostic.getBluetoothState()
  .then((state) => {
    console.log(state);
    if (state == this.diagnostic.bluetoothState.POWERED_ON){
      // do something
    } else {
      // do something else
    }

}).catch(e => console.error(e));
}).catch(error=>{

  console.log(error);
});

}

error:
ERROR TypeError: Object(…) is not a function
at Diagnostic.isLocationEnabled (vendor.js:127427)
at ListPage.webpackJsonp.11.ListPage.ionViewWillEnter (main.js:506)
at ViewController._lifecycle (vendor.js:35671)
at ViewController._willEnter (vendor.js:35569)
at NavControllerBase._willEnter (vendor.js:73491)
at vendor.js:73384
at t.invoke (polyfills.js:3)
at Object.onInvoke (vendor.js:5135)
at t.invoke (polyfills.js:3)
at r.run (polyfills.js:3)

Posts: 1

Participants: 1

Read full topic

@Miyata wrote:

Hello everyone. Currently I’m trying to build an Ionic 3 App where I’m supposed to play a youtube video (already did this part) but if I navigate to another tab/view the video continues to play in that view. An example would be the mobile youtube app, where you can still be searching videos while the video is up and playing.

Thank’s everyone for your time.

Posts: 1

Participants: 1

Read full topic

@evripides wrote:

I have the below function that in loop call other function but every time I run it I get the in wrong position data in array , maybe I have to wait to finish the forwardGeocode to finish and after the loop continues to next? if yes how I can make it?

  News() {
    this.restProvider.getNews()
    .then(data => {
       this.NewsDetails = data;
       this.date = this.NewsDetails[1].date;
       this.day = this.NewsDetails[1].day;
      for(let i=0;i<this.NewsDetails.length;i++){
        this.full_address = this.NewsDetails[i].address + ', ' + this.NewsDetails[i].town;
        this.forwardGeocode(this.full_address);
        console.log(this.full_address);
        
      }
    });
    console.log(this.full_address);

  forwardGeocode(keyword) 
  {
        this._GEOCODE.forwardGeocode(keyword)
        .then((coordinates : NativeGeocoderForwardResult[]) =>
        {
           let str : string   = `The coordinates are latitude=${coordinates[0].latitude} and longitude=${coordinates[0].longitude}`;
           //console.log(str);
           this.results       = str;
           this.cords.push(str);
           this.plat = coordinates[0].latitude;
           this.plong = coordinates[0].longitude;

           console.log(this.cords);
           console.log(this.mylat,this.plat,this.mylongt,this.plong,'alo4');

           this.calculateDistance(this.mylat,this.plat,this.mylongt,this.plong);

           
        })
        .catch((error: any) =>
        {
           console.log(error);
           
        });
     
  }
  }```

Posts: 1

Participants: 1

Read full topic

@marwakr wrote:

Hi every body i want to integrate authentification provider in my ionic 3 mobile app to link with endpoint developed with php. who can help me please or suggest to me a good tutorial to follow

Posts: 1

Participants: 1

Read full topic

@tfrutuoso wrote:

Hi Gang,

I am building an app on which I ask an API for a authentication token. The token is stored using Storage.

The problem is that I ask the token on the authentication page (the home page), and when I need to build any other feature, I have to navigate from the beginning of the app (login page) until the level where I am implementing the new feature. In order to save time on the implementation of the new feature, I’d like to mock the authentication token by starting the ionic server and defining an environment variable, so that in my source code, I can check if the environment variable is set, if it is set, I’ll take it’s value as the authentication token and I’ll override the whole session logic.

I’ve seen the documentation, I know that maybe I can add a key-value pair inside this file: ionic.config.json but I don’t know how to access it’s content through my source code on the application.

Best,

Posts: 1

Participants: 1

Read full topic

@renangueiros wrote:

I would like to know how to implement unit form tests with karma.
I’ve implemented a test but it always gives the following error: Error: No value accessor for form control with name: 'email'

signup.module.ts

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { Routes, RouterModule } from '@angular/router';
import { IonicModule } from '@ionic/angular';
import { SignupPage } from './signup.page';

const routes: Routes = [{ path: '', component: SignupPage  }];

@NgModule({
  imports: [CommonModule, FormsModule, ReactiveFormsModule, IonicModule, RouterModule.forChild(routes)],
  declarations: [SignupPage]
})
export class SignupPageModule {}

signup.page.html

<ion-header no-border>
  <ion-toolbar>

    <ion-buttons slot="start">
      <ion-back-button defaultHref="/"></ion-back-button>
    </ion-buttons>

    <ion-title>
      <img src="../../../../assets/logo-colored.png">
    </ion-title>

    <ion-buttons slot="end">
      <div class="center-title-helper"></div>
    </ion-buttons>

  </ion-toolbar>
</ion-header>

<ion-content padding>

  <ion-progress-bar [hidden]="true" type="indeterminate"></ion-progress-bar>

  <img src="../../../../assets/logo-colored.png">

  <h3 text-center>Criar Conta</h3>

  <ion-list no-padding>
    <form [formGroup]="signupForm" (ngSubmit)="submitSignupForm()">

      <ion-item [ngClass]="{ 'ion-touched ion-invalid' : emailControl.invalid }">
        <ion-label position="floating">E-mail</ion-label>
        <ion-input formControlName="email" type="e-mail"></ion-input>
      </ion-item>

      <div *ngIf="emailControl.invalid" padding-start>
        <ion-note *ngIf="emailControl.hasError('required')" color="danger">
          Insira o seu endereço de e-mail
        </ion-note>
      </div>

      <ion-item [ngClass]="{ 'ion-touched ion-invalid' : passwordControl.invalid }">
        <ion-label position="floating">Senha</ion-label>
        <ion-input clearOnEdit="false" formControlName="password" type="password"></ion-input>
      </ion-item>

      <div *ngIf="passwordControl.invalid" padding-start>
        <ion-note *ngIf="passwordControl.hasError('required')" color="danger">
          Insira a sua senha
        </ion-note>
      </div>

      <ion-button [hidden]="true">Fake Button</ion-button>

    </form>
  </ion-list>

</ion-content>

<ion-footer>
  <ion-toolbar>
    <ion-button expand="block" shape="round" (click)="submitSignupForm()">Criar Conta</ion-button>
  </ion-toolbar>
</ion-footer>

signup.page.ts

import { Component, OnInit } from '@angular/core';
import { AbstractControl, FormControl, FormGroup } from '@angular/forms';

@Component({
  selector: 'app-signup',
  templateUrl: './signup.page.html',
  styleUrls: ['./signup.page.scss'],
})
export class SignupPage implements OnInit {

  signupForm: FormGroup;

  constructor() { }

  ngOnInit() {
    this.signupForm = new FormGroup({
      email: new FormControl(''),
      password: new FormControl(''),
    });
  }

  submitSignupForm() {
    if (this.validateForm) {

    }
  }

  get validateForm(): boolean {
    if (this.emailControl.value === '') { this.emailControl.setErrors({ required: true }); }
    if (this.passwordControl.value === '') { this.passwordControl.setErrors({ required: true }); }

    return this.signupForm.valid;
  }

  get emailControl(): AbstractControl {
    return this.signupForm.controls['email'];
  }

  get passwordControl(): AbstractControl {
    return this.signupForm.controls['password'];
  }

}

signup.page.spec.ts

import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';

import { SignupPage } from './signup.page';

describe('SignupPage', () => {
  let component: SignupPage;
  let fixture: ComponentFixture<SignupPage>;

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [ SignupPage ],
      imports: [
        FormsModule,
        ReactiveFormsModule
      ],
      schemas: [CUSTOM_ELEMENTS_SCHEMA],
    })
    .compileComponents();
  }));

  beforeEach(() => {
    fixture = TestBed.createComponent(SignupPage);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

  it('should create', () => {
    expect(component).toBeTruthy();
  });
});

Full log when I run the ng test command

Error: No value accessor for form control with name: 'email'
    at _throwError (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/forms/fesm5/forms.js:2144:1)
    at setUpControl (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/forms/fesm5/forms.js:2054:1)
    at FormGroupDirective.push../node_modules/@angular/forms/fesm5/forms.js.FormGroupDirective.addControl (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/forms/fesm5/forms.js:5281:1)
    at FormControlName.push../node_modules/@angular/forms/fesm5/forms.js.FormControlName._setUpControl (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/forms/fesm5/forms.js:5882:1)
    at FormControlName.push../node_modules/@angular/forms/fesm5/forms.js.FormControlName.ngOnChanges (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/forms/fesm5/forms.js:5803:1)
    at checkAndUpdateDirectiveInline (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/fesm5/core.js:22085:1)
    at checkAndUpdateNodeInline (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/fesm5/core.js:23353:1)
    at checkAndUpdateNode (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/fesm5/core.js:23315:1)
    at debugCheckAndUpdateNode (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/fesm5/core.js:23949:1)
    at debugCheckDirectivesFn (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/fesm5/core.js:23909:1)

Posts: 1

Participants: 1

Read full topic