@juanma97 wrote:

Hello, I have an Ionic application that use firebase authentication, when the user sign up in the app, it is created an entry in firebase database with user data(name, lastname, phone, etc). I want get this data and save in the store with ngRx to use in few views on the app, and update when the user update the data.

I know the redux pattern: Actions -> Reducers -> State … but I don’t know how implemented this in my app. I saw some tutorials on Internet, but they do not help me much.

Someone know any tutorial or code that could help me.

Thank you!

Posts: 1

Participants: 1

Read full topic

@hugohrlt wrote:

Hi,

So i’m working on my first Ionic project and I was wondering if there is any possibilities to make a modular app.
What I mean by that is, an app where you can add and remove functionalities that you developed the same way you add and remove plugins for example.
This is my first time working in the mobile world so I apologize if my question seems dumb…

Thank you.

Posts: 1

Participants: 1

Read full topic

@wibits wrote:

Hi,
I am creating a real time application. So I need to post my data to mysql database for every 5 secs.
But it is not working properly and make mobile to hang. Is there any solutions to fix this in ionic?
Thanks…

Posts: 1

Participants: 1

Read full topic

@hunter0811 wrote:

I upgrade my project from ionic v4 beta to ionic v4.0.0 stable. Now i am trying to run my app in android 5.0 device it hangs on white screen just after splash.

Here is my ionic info:

Ionic:

   ionic (Ionic CLI)             : 4.10.2 (/usr/local/lib/node_modules/ionic)
   Ionic Framework               : @ionic/angular 4.0.0
   @angular-devkit/build-angular : 0.12.4
   @angular-devkit/schematics    : 7.2.4
   @angular/cli                  : 7.2.4
   @ionic/angular-toolkit        : 1.3.0

Cordova:

   cordova (Cordova CLI) : 8.1.2 (cordova-lib@8.1.1)
   Cordova Platforms     : android 7.1.4
   Cordova Plugins       : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 2.3.3, (and 10 other plugins)

System:

   Android SDK Tools : 26.1.1 (/Users/hsain/Library/Android/sdk)
   NodeJS            : v10.11.0 (/usr/local/Cellar/node/10.11.0/bin/node)
   npm               : 6.7.0
   OS                : macOS Mojave
   Xcode             : Xcode 10.1 Build version 10B61

I am getting the key viewport-fit is not recognized and ignored. android error.

Screenshot 2019-02-07 at 3.43.02 PM.jpg2616×1560 209 KB

Posts: 1

Participants: 1

Read full topic

@madmartigan wrote:

I recently updated my Mac with the latest build and after not being able to run an existing application I decided to try samples and found I get the same error.

I have following versions of tools

XCode Version 9.3 (9E145)
Ionic CLI 4.10.2
Cordova 6.5.0

I run the commands to build the sample applications and build the ios platform which all works. I then load in XCode and the simulator shows the splash screen then a white screen. The output in the console is as follows ;

2019-02-07 17:49:04.884561+0800 MyApp[3078:63620] DiskCookieStorage changing policy from 2 to 0, cookie file: file:///Users/neil/Library/Developer/CoreSimulator/Devices/83B940CC-B60F-479C-B44D-5FD77AB24C12/data/Containers/Data/Application/C4BCD7A2-C73A-46B2-8C95-4890D48362C6/Library/Cookies/io.ionic.starter.binarycookies

2019-02-07 17:49:05.111700+0800 MyApp[3078:63620] Apache Cordova native platform version 4.3.1 is starting.
2019-02-07 17:49:05.112433+0800 MyApp[3078:63620] Multi-tasking -> Device: YES, App: YES
2019-02-07 17:49:05.243864+0800 MyApp[3078:63620] Using UIWebView
2019-02-07 17:49:05.246820+0800 MyApp[3078:63620] [CDVTimer][handleopenurl] 0.093937ms
2019-02-07 17:49:05.248822+0800 MyApp[3078:63620] [CDVTimer][intentandnavigationfilter] 1.846075ms
2019-02-07 17:49:05.249057+0800 MyApp[3078:63620] [CDVTimer][gesturehandler] 0.075936ms
2019-02-07 17:49:05.260996+0800 MyApp[3078:63620] [CDVTimer][statusbar] 11.798024ms
2019-02-07 17:49:05.291166+0800 MyApp[3078:63620] [CDVTimer][splashscreen] 29.983044ms
2019-02-07 17:49:05.291412+0800 MyApp[3078:63620] CDVIonicKeyboard: resize mode 1
2019-02-07 17:49:05.292497+0800 MyApp[3078:63620] CDVIonicKeyboard: WARNING!!: Keyboard plugin works better with WK
2019-02-07 17:49:05.292749+0800 MyApp[3078:63620] [CDVTimer][keyboard] 1.383901ms
2019-02-07 17:49:05.292910+0800 MyApp[3078:63620] [CDVTimer][TotalPluginStartup] 46.199083ms
2019-02-07 17:49:06.646670+0800 MyApp[3078:63620] Resetting plugins due to page load.

Anyone else had this issue or a workaround ?

Posts: 1

Participants: 1

Read full topic

@anupzone wrote:

In latest version, border bottom from ion-segment button removed from mobile view.

.segment-button-indicator {
	display: none;
}

in DOM shadow. and unable to override this. any solution?

Posts: 1

Participants: 1

Read full topic

@Ravirapolu wrote:

Hi Frnds,

Iam creating one e commernce app, i want payment gateway so i used paypal but if i keep Currency INR its not renedering to paypal and unable to make transaction . But if i keep USD its works. Suggest me any solution for that . If we have idea about any other payment gateway like paytm, phonepe please help me.

Thanks,
Ravi

Posts: 1

Participants: 1

Read full topic

@jonmikelm wrote:

Using the Angular Reactive Forms API, when markAsTouched() function is called over a FormControl, the corresponding ion-touched class is not applied to the ion-item (nor to the ion-input). Only the ng-touched is applied.
This problem occurs with each of the markAs*** functions:

• markAsTouched
• markAsUntouched
• markAsDirty
• markAsPristine
• markAsPending

Angular Reactive Forms FormControl status classes (ng-XXX) should be paired with the corresponding ion-XXX classes on every FormControl status change.

This is not the first issue I’ve found regarding form control validations. Ionic 4 has a considerable room for improvement in this regard.

Posts: 1

Participants: 1

Read full topic

@rob0to wrote:

I have a problem with deployment Ionic app into iOS emulator.

After build using the following command:

ionic cordova run ios -l -- --buildFlag="-UseModernBuildSystem=0"

I will get after a successful build and start emulator following cli message:

 [cordova]  ** BUILD SUCCEEDED **
[cordova]  
[cordova]  No target specified for emulator. Deploying to iPhone-X, 12.1 simulator
[cordova]  An error was encountered processing the command (domain=NSPOSIXErrorDomain, code=2):
[cordova]  Failed to install the requested application
[cordova]  An application bundle was not found at the provided path.
[cordova]  Provide a valid path to the desired application bundle.

With No app installed into the emulator.

I tried to open the generated project in Xcode SDK and after the run in Xcode the app is launched in emulator but stuck on the splash screen with the exception in file main.h on line:

int retVal = UIApplicationMain(argc, argv, nil, @"AppDelegate");

I tried almost everything, update cordova, ionic, ionic scripts, remove and install ios platform but all tries with same result.

I found that before several hours has been released cordova-ios in version 5.0.0

But is not possible to install this version using CLI so I cannot try and verify impact.

So current used version is

<engine name="ios" spec="4.5.5" />

Ionic info result is following:

Ionic:

   ionic (Ionic CLI)  : 4.10.2 (/usr/local/lib/node_modules/ionic)
   Ionic Framework    : ionic-angular 3.9.2
   @ionic/app-scripts : 3.2.2

Cordova:

   cordova (Cordova CLI) : 8.1.2 (cordova-lib@8.1.1)
   Cordova Platforms     : android 7.1.4, ios 4.5.5
   Cordova Plugins       : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 2.3.2, (and 5 other plugins)

System:

   Android SDK Tools : 26.1.1 (/Users/def/Library/Android/sdk)
   ios-deploy        : 1.9.1
   ios-sim           : 5.0.13
   NodeJS            : v10.6.0 (/usr/local/bin/node)
   npm               : 6.7.0
   OS                : macOS Mojave
   Xcode             : Xcode 10.1 Build version 10B61

I tried everything but without luck.

What should i try to run app in emulator or device?

Thanks for any advice.

Origin topic can be found here:

Posts: 1

Participants: 1

Read full topic

@JoseGonzaga wrote:

Create an application with back-end spring-rest and front-end with Ionic3. It’s working locally. So I put the backend on the Amazon ec2. I am getting access to end-points through Postman or the browser itself, but I can not access through the front-end. It returns the following information: “Cross origin requests are only supported for HTTP.” and a second information “[Error] XMLHttpRequest can not load ec2-52-67-72-74.sa-east-1.compute.amazonaws.com:8080/login due to access control checks.”. How can I resolve this? thanks.

Posts: 1

Participants: 1

Read full topic

@Mathe13 wrote:

Hi i got a project in inocic 3.x and i am trying to use the socialSharing plugin(https://ionicframework.com/docs/native/social-sharing/) i followed all the steps found in this tutorial(https://medium.com/@mikeyny/easy-social-sharing-with-ionic-3-and-ionic-native-f2c42807f43c) but when i click the butto binded to the share function it show the error ‘object is not a function at socialShare.share()’

my ionic info:

Ionic:

   ionic (Ionic CLI)  : 4.10.1 (/usr/lib/node_modules/ionic)
   Ionic Framework    : ionic-angular 3.9.2
   @ionic/app-scripts : 3.2.0

Cordova:

   cordova (Cordova CLI) : 8.1.2 (cordova-lib@8.1.1)
   Cordova Platforms     : android 7.0.0, browser 5.0.4
   Cordova Plugins       : cordova-plugin-ionic-keyboard 2.1.2, cordova-plugin-ionic-webview 2.1.4, (and 10 other plugins)

System:

   Android SDK Tools : 26.1.1 (/opt/SDK)
   NodeJS            : v11.8.0 (/usr/bin/node)
   npm               : 6.5.0
   OS                : Linux 4.15

my cordova plugins:

cordova-plugin-device 2.0.2 "Device"
cordova-plugin-device-motion 2.0.1 "Device Motion"
cordova-plugin-geolocation 4.0.1 "Geolocation"
cordova-plugin-gyroscope 0.1.4 "Device Gyroscope"
cordova-plugin-ionic-keyboard 2.1.2 "cordova-plugin-ionic-keyboard"
cordova-plugin-ionic-webview 2.1.4 "cordova-plugin-ionic-webview"
cordova-plugin-request-location-accuracy 2.2.3 "Request Location Accuracy"
cordova-plugin-splashscreen 5.0.2 "Splashscreen"
cordova-plugin-statusbar 2.4.2 "StatusBar"
cordova-plugin-whitelist 1.3.3 "Whitelist"
cordova-plugin-x-socialsharing 5.4.4 "SocialSharing"
cordova-sqlite-storage 2.6.0 "Cordova sqlite storage plugin"
es6-promise-plugin 4.2.2 "Promise"

my package.json: (https://pastebin.com/dWRUGnqr)

Posts: 1

Participants: 1

Read full topic

@pstampfer wrote:

  <form [formGroup]="loginForm" (submit)="login()">
    <ion-item>
      <ion-input type="text" formControlName="username"></ion-input>
    </ion-item>
    <ion-item>
      <ion-textarea type="text" formControlName="password"></ion-textarea>
    </ion-item>
    <ion-button type="submit">Submit</ion-button>
  </form>

i had the issue, that the input binding didn’t work then I found the resolved issue but it still doesn’t work after importing the FormsModule in app.module.ts or my component.module.ts

i am currently using ionic 4.10.2- the latest release and also tried it with a fresh project.

Thanks

Posts: 1

Participants: 1

Read full topic

@darrenM96 wrote:

Toast not working.I have been creating a simple ionic app using firebase to handle my login. When the user enters correct email and password, it logs in and a toast message show to say logged in. When the email or password is incorrect the toast message to inform the user wont pop up.

Login.html

<!--
  Generated template for the LoginPage page.

  See http://ionicframework.com/docs/components/#navigation for more info on
  Ionic pages and navigation.
-->
<ion-header>

  <ion-navbar>

    <ion-title>   <img src="../../assets/imgs/leaf.png" alt="couldn't load"></ion-title>
  </ion-navbar>

</ion-header>

<ion-content padding>







<ion-item>
<ion-label floating>Email Address</ion-label>
<ion-input type="text" [(ngModel)]="user.email"></ion-input>
</ion-item>

<ion-item>
<ion-label floating>Password</ion-label>
<ion-input type="password" [(ngModel)]="user.password"></ion-input>
</ion-item>

<button ion-button (click)="login(user)">Login</button>
<button ion-button color="light" (click)="register()">Register</button>
<button ion-button (click)="information()">Information</button>






</ion-content>

Login.ts

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams, ToastController } from 'ionic-angular';
//import { Loginbutton } from '/Loginbutton';
import { HomePage } from '../home/home';
import { User } from "../../models/user";
import { RegisterPage } from "../register/register";
import { InformationPage } from "../information/information";
import { AngularFireAuth} from 'angularfire2/auth';
import { ToastController } from 'ionic-angular';

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

@IonicPage()
@Component({
  selector: 'page-login',
  templateUrl: 'login.html',
})
export class LoginPage {
	user = {} as User;
  constructor(private aFauth: AngularFireAuth,  public toastCtrl: ToastController,
  	public navCtrl: NavController, public navParams: NavParams) {


  }



 openHomePage(){
this.navCtrl.setRoot(HomePage);
 }





	async login(user: User) {
    try{
   const result = await this.aFauth.auth.signInWithEmailAndPassword(user.email, user.password);

if(result){
this.navCtrl.setRoot(HomePage);	
  let toast = this.toastCtrl.create({
      message: 'Successfully Logged In',
      duration: 3000
    });
    toast.present();
}
   else {
      let toast = this.toastCtrl.create({
      message: 'Incorrect Email/Password',
      duration: 3000
    });
    toast.present();}}

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

 register(){
 	this.navCtrl.push(RegisterPage);

 }
 information(){
 	this.navCtrl.push(InformationPage);
 }


}

The toast is in the else statement at the bottom.

Posts: 1

Participants: 1

Read full topic

@Lona wrote:

Hi there,

I would like to add RPG-awesome (similar to font awesome) to an Ionic 4 app. Anyone done that?

Posts: 1

Participants: 1

Read full topic

@pradeepkaatnam wrote:

I am working on an IONIC & FIREBASE application. I have integrated Phone authentication with invisible recaptcha provided by firebase as my auth in the app. As part of phone number verification with OTP, sometimes the invisible recaptcha prompts a recaptcha challenge for the user to solve in-order to proceed further. Now everything works fine if the challenge was solved successfully but if I select some wrong images in the recaptcha challenge then the pop up gets closed and no call back function is getting invoked.

This is my firebase RecaptchaVerifier code:

ngOnInit(){
    this.recaptchVerifier = new auth.RecaptchaVerifier('sign-in-button', {
      'size': 'invisible',
      'callback': function(response) {
        // reCAPTCHA solved, allow signInWithPhoneNumber.
        console.log("recapcha verified. ", response);
      },
      'expired-callback': function() {
        // Response expired. Ask user to solve reCAPTCHA again.
        // ...
        console.log("Recaptcha expired.");
        this.spinner.dismiss();
      },
      'error-callback': function() {
        console.log("Error occurred");
        this.spinner.dismiss();
      }
    });
  }

I have implemented all the callbacks available on the recapthca but nothing is getting invoked if the challenge was unsuccessful. So how do I know when user fails to solve the recaptcha challenge so that I can tell the user to try again.

Thanks in advance.

Posts: 1

Participants: 1

Read full topic

@znix wrote:

I have installed admob free plugin, using the exact same code from the documentation: https://ionicframework.com/docs/native/admob-free/

I have wrapped this code in a function which I call in my constructor

const bannerConfig: AdMobFreeBannerConfig = {
 // add your config here
 // for the sake of this example we will just use the test config
 isTesting: true,
 autoShow: true
};
this.admobFree.banner.config(bannerConfig);

this.admobFree.banner.prepare()
  .then(() => {
    // banner Ad is ready
    // if we set autoShow to false, then we will need to call the show method here
  })
  .catch(e => console.log(e));

however I get the following error on the line with this statement: this.admobFree.banner.config(bannerConfig);

core.js:1449 ERROR Error: Uncaught (in promise): TypeError: Object(…) is not a function
TypeError: Object(…) is not a function
at AdMobFreeBanner.config (index.js:91)
at HomePage. (home.ts:104)
at step (main.js:972)
at Object.next (main.js:953)
at main.js:947
at new t (polyfills.js:3)
at webpackJsonp.54.__awaiter (main.js:943)
at HomePage.webpackJsonp.54.HomePage.bannerAd (home.ts:98)
at new HomePage (home.ts:90)
at createClass (core.js:12491)
at AdMobFreeBanner.config (index.js:91)
at HomePage. (home.ts:104)
at step (main.js:972)
at Object.next (main.js:953)
at main.js:947
at new t (polyfills.js:3)
at webpackJsonp.54.__awaiter (main.js:943)
at HomePage.webpackJsonp.54.HomePage.bannerAd (home.ts:98)
at new HomePage (home.ts:90)
at createClass (core.js:12491)
at c (polyfills.js:3)
at new t (polyfills.js:3)
at webpackJsonp.54.__awaiter (main.js:943)
at HomePage.webpackJsonp.54.HomePage.bannerAd (home.ts:98)
at new HomePage (home.ts:90)
at createClass (core.js:12491)
at createDirectiveInstance (core.js:12326)
at createViewNodes (core.js:13784)
at createRootView (core.js:13673)
at callWithDebugContext (core.js:15098)

Can someone please advise, is it something to do with my plugin version and ionic native core?

Posts: 1

Participants: 1

Read full topic

@flotilla wrote:

hi there,
i use icons but “more” icon looks vertically. i need it horizantally. do you have any solutions for that?

<ion-tab-button tab="tab2">
            <ion-icon style="color: white; font-size: 35px; " name="more"></ion-icon>        
  </ion-tab-button>

Posts: 1

Participants: 1

Read full topic

@xenos2011 wrote:

Hello Ionic Developers, I’m using Ionic 3 for a work project. The project isn’t that large to say ( about 10 pages by now ).

I’ve been generating components, providers and pages using the CLI and have done all of the project the Ionic default way ( shared components module, all providers loaded from app.modules ), only the pages are lazy loaded.

The problem is that recently I found out that there is a separate team working on the project but slightly modified. Their tasks are mostly design related so they rely the logic on me, hence the fact that the other team has little experience with programming in Ionic.

So I thought id would be much better if I separate everything in modules, best way being a more react way of " separation of concerns ". Instead of having a components / pipes / providers / directives folders, everything that a specific page requires would be inside the page folder itself.

So instead of this

image.png334×637 24.2 KB

I would have something like this

image.png335×694 26 KB

locations page in this example will have all it’s own providers, pipes and components nested inside the locations folder, lazy loading them when the page is accessed.

The reason behind this logic is to ease the work of the other team thus not needing to explain which modules they need to copy and link to their components.modules or in app.modules. This way they only need to copy the specific page folder and link within other pages to that page.

A global components / pipes / providers would still exist for them so that existing pages wont be broken, but all new pages that I provide for them to modify would not require any outside modules ( if they do not exist ). I would still use global components in cases where they are already created and used within other pages ( for app size reasons ).

EDIT: all the providers, pipes, components inside the pages are heavily custom, so they wont be needed in any other pages, keeping each page as separate as it could be, their only link would be by the NavController.

My question would be if someone can explain how to do this or at least point me to some resources that I could learn to do this.

Thanks to all in advance for going thru all the post.

Posts: 1

Participants: 1

Read full topic

@jasoncartermartin wrote:

Hello, I am having an error running the simple command of ionic serve natively in Windows. However, ionic cordova build android works fine in the same shell. This is the error that running ionic serve in cmd.exe gives:

ionic serve
> ng run app:serve --host=0.0.0.0 --port=8100
[ng] 'sh' is not recognized as an internal or external command,
[ng] operable program or batch file.

However, running ng run app:serve --host=0.0.0.0 --port=8100 directly works just fine…

The ionic serve command also works properly in Linux through WSL, however the problem with that approach is that node-sass has to be recompiled with Linux bindings to do this.

Any reason why this is happening, or workarounds/fixes?

Thanks!

Posts: 2

Participants: 1

Read full topic

@ioclaudio wrote:

Hi,
building an Ionic3 app on iOS I’ve this error:

** BUILD FAILED **

The following build commands failed:
	CompileC /var/root/Library/Developer/Xcode/DerivedData/LibApp_Assistant-elxtqmfxxzicbsgyrbocrztpflkc/Build/Intermediates/LibApp\ Assistant.build/Debug-iphonesimulator/LibApp\ Assistant.build/Objects-normal/x86_64/CDVBarcodeScanner.o LibApp\ Assistant/Plugins/phonegap-plugin-barcodescanner/CDVBarcodeScanner.mm normal x86_64 objective-c++ com.apple.compilers.llvm.clang.1_0.compiler
(1 failure)
CordovaError: Promise rejected with non-error: 'Error code 65 for command: xcodebuild with args: -xcconfig,/users/claudio/Workspace/Ionic3/LibAppassistant/ionic/platforms/ios/cordova/build-debug.xcconfig,-workspace,LibApp Assistant.xcworkspace,-scheme,LibApp Assistant,-configuration,Debug,-sdk,iphonesimulator,-destination,platform=iOS Simulator,name=iPhone SE,build,CONFIGURATION_BUILD_DIR=/users/claudio/Workspace/Ionic3/LibAppassistant/ionic/platforms/ios/build/emulator,SHARED_PRECOMPS_DIR=/users/claudio/Workspace/Ionic3/LibAppassistant/ionic/platforms/ios/build/sharedpch'
    at cli.catch.err (/usr/local/lib/node_modules/cordova/bin/cordova:30:15)
    at processTicksAndRejections (internal/process/next_tick.js:81:5)
[ERROR] An error occurred while running subprocess cordova.
        cordova build ios exited with exit code 1
        Re-running this command with the --verbose flag may provide more information.

This is the output of the ionic info command:

sh-3.2# ionic info

Ionic:
   ionic (Ionic CLI)  : 4.10.2 (/usr/local/lib/node_modules/ionic)
   Ionic Framework    : ionic-angular 3.9.2
   @ionic/app-scripts : 3.2.2

Cordova:
   cordova (Cordova CLI) : 8.1.2 (cordova-lib@8.1.1)
   Cordova Platforms     : ios 4.5.5
   Cordova Plugins       : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 3.1.2, (and 7 other plugins)

System:
   ios-sim : 5.0.4
   NodeJS  : v11.8.0 (/usr/local/bin/node)
   npm     : 6.7.0
   OS      : OS X El Capitan
   Xcode   : Xcode 8.1 Build version 8B62

These are the cordova plugin installed:

cordova plugin ls
cordova-plugin-device 2.0.2 "Device"
cordova-plugin-document-viewer 0.9.10 "SitewaertsDocumentViewer"
cordova-plugin-file 6.0.1 "File"
cordova-plugin-file-transfer 1.7.1 "File Transfer"
cordova-plugin-ionic-keyboard 2.1.3 "cordova-plugin-ionic-keyboard"
cordova-plugin-ionic-webview 3.1.2 "cordova-plugin-ionic-webview"
cordova-plugin-splashscreen 5.0.2 "Splashscreen"
cordova-plugin-whitelist 1.3.3 "Whitelist"
phonegap-plugin-barcodescanner 8.0.1 "BarcodeScanner"

What could be the problem?

I’ve already tried to remove and add again the ios platform,

Thank you very much

cld

Posts: 1

Participants: 1

Read full topic