@singh2210 wrote:

Can we add Paytm payment gateway integration on ionic …is this Possible???

Posts: 2

Participants: 2

Read full topic

@raz-ride4you wrote:

I would like to pop a modal in Ionic 4 with AngularJS (why there no category for Ionic 4 in this forum btw? I posted this on Ionic at general) and I want to put a directive inside the modal.

However Ionic 4 doesn’t allow to pop a modal on any HTML ID/class or attribute, where I can just lay a directive, and therefore I don’t have how to inject the data of the remote directive to the modal.

For example this is the Ionic 4 docs about modal for plain JS:

customElements.define('modal-page', class extends HTMLElement {
  connectedCallback() {
    this.innerHTML = `
<ion-header>
  <ion-toolbar>
    <ion-title>Super Modal</ion-title>
  </ion-toolbar>
</ion-header>
<ion-content>
  Content
</ion-content>`;
  }
});

async function presentModal() {
  // initialize controller
  const modalController = document.querySelector('ion-modal-controller');
  await modalController.componentOnReady();

  // present the modal
  const modalElement = await modalController.create({
    component: 'modal-page'
  });
  await modalElement.present();
}

As you can see, they register a new component with the customElements.define which I really don’t know what it is - they don’t describe on it anywhere.

But the problem in here is that they fetch HTML content - however I need to fetch the whole directive with his JS mechanism.

My questions:

1. How can I do that? (based on AngularJS 1.7.2 directives).
2. What is the customElements.define in Ionic - where can I find any explanation about this?

Posts: 1

Participants: 1

Read full topic

@yogeshyoyo wrote:

Hi,

Can anyone help me how to achieve this in ionic3/4 please. Thanks in advance.

dayselection.jpg1280×720 55.7 KB

Posts: 1

Participants: 1

Read full topic

@yogeshyoyo wrote:

Hi,

i am trying to use dhtmlx scheduler which is used in my previous project using ionic 1 and angularjs. i tried use same library from npm( https://www.npmjs.com/package/dhtmlx-scheduler ) and followed this tutorial(https://dhtmlx.com/blog/angular-dhtmlxscheduler-tutorial/) to implement scheduler view in the app.
i have created a app using ‘ionic start myapp blank’ and followed the above tutorial but i am getting
error: Cannot find name ‘scheduler’.

can anyone suggest the solution for this please.Thanks in advance

Posts: 1

Participants: 1

Read full topic

@coolestsumit wrote:

while connecting GitHub to ionic for live deploy getting on error of " Failed to create webhook. You may not have permission to create webhooks on this repo in GitHub.There was an error trying to connect to your repository".Kindly help waiting for the revert. Thanks in advance

Posts: 1

Participants: 1

Read full topic

@navod1997 wrote:

My code is working when my app running. but when app was closed it’s not working…

this is my app.component.ts file

I am using php api to create notification using onesignel. I attached some data to notification and I use it for navigate. actually that data is my navigation route…

import { Component } from '@angular/core';
 import { Platform, AlertController } from '@ionic/angular';
 import { StatusBar } from '@ionic- native/status-bar/ngx';
 import { OneSignal } from '@ionic-native/onesignal/ngx';
 import { Router } from '@angular/router';

@Component({
   selector: 'app-root',
 templateUrl: 'app.component.html'
    })
export class AppComponent {
 constructor(
private platform: Platform,
private statusBar: StatusBar,
private oneSignal: OneSignal,
private router: Router,
public alertController: AlertController,
public home: HomePage
) {
this.initializeApp();
}

initializeApp() {
this.platform.ready().then(() => {
  this.statusBar.styleDefault();

this.oneSignal.startInit('xxxxxxxxxxxx', 'xxxxxxx');

this.oneSignal.inFocusDisplaying(this.oneSignal.OSInFocusDisplayOption.InAppAlert);

  this.oneSignal.handleNotificationReceived().subscribe(() => {
   // do something when notification is received

  });

  this.oneSignal.handleNotificationOpened().subscribe((data: any) => {
    // do something when a notification is opened

    if (data.notification.payload.additionalData.url && data.notification.payload.additionalData.id) {


      let rout = data.notification.payload.additionalData;

      let path = rout.url;

      let id = rout.id;

       let route = '/tabs/' + path + '/' + id;

       this.router.navigateByUrl(route);

    } else {

        // this.home.testnoti(JSON.stringify(data), JSON.stringify(data.notification.payload.additionalData));

      }


  });

  this.oneSignal.endInit();

 });
}
}

Posts: 1

Participants: 1

Read full topic

@To2gomes wrote:

Hello, recently acquire the admob-pro plugin license.
But I already have an application in production where I already used this plugin.
My implementation was as follows, on every page I wanted to display the ad I did the following:
Note: this I do in all the pages where I make the announcement call.
In the example here I use the home.
Come on.
I realize plugin and platform import:

import { AdMobPro } from '@ionic-native/admob-pro';
import { Platform } from 'ionic-angular';

then inside the construct make these settings

constructor(
    public navCtrl: NavController,
    public navParams: NavParams,
    public loadingCtrl: LoadingController,
    private toastCtrl: ToastController,
    platform: Platform,
    private admob: AdMobPro
  ) {
    platform.ready().then(() => {
      var admobid = {
          licença: "?????????????????????????????????????",
          banner: 'ca-app-pub-5884050189104927/9827819257',
          interstitial: 'ca-app-pub-5884050189104927/1013482083'
      };

      this.admob.createBanner({
          adId: admobid.banner,
          isTesting: false,
          autoShow: false,
          position: this.admob.AD_POSITION.BOTTOM_CENTER
      })

      this.admob.prepareInterstitial({
          adId: admobid.interstitial,
          isTesting: false,
          autoShow: true
      })
  });
  }

then logs down when performing a click event I make the announcement block call:
this.admob.showInterstitial();

openView(view) {
    this.navCtrl.push(ViewPage, { id: view.videos_id });
    this.admob.showInterstitial();
  }

and this follows on every page.

Now let’s get down to the problem:
Upon contacting the plugin developer he said the following:

Please set your license key in options first by calling setOptions (), createBanner (), and prepareInterstitial (). You only have to configure it once.

if (AdMob) AdMob.createBanner ({
licença: " sua licença",
adId: "your_ad_unit_id_for_banner_here"
});

he said that, it is not correct. You should not initialize the plug-in on each page.
You need to initialize the plug-in only once.
How do I make the plugin call only once.

Posts: 1

Participants: 1

Read full topic

@cengiz74 wrote:

Hello everybody, I would really apreciate some help. I am using the HttpClient ( import {HttpClient} from ''@angular/common/http'; ). I can log data and error returned when subscribing to httpClient.get for instance if the project is launched on a browser. But when I launch my project for android on a Samsung galaxy s8 + no logs get returned. It looks like if subscription was ignored. I am using Angular7, Ionic4 and Capacitor, here is the sample code used:

import {HttpClient} from '@angular/common/http';

doTest() {
    console.log('Test'); // <-- Logging on both browser and Android
    this.httpClient.get('example.com').subscribe(
      data => console.log(data), // <-- Logging only in browser
      error => console.log(error), //  <-- Logging only in browser
    );
  }

Posts: 1

Participants: 1

Read full topic

@blondie63 wrote:

Hi all, i’m using this code:

this.translate.get('ALERT_ERROR').subscribe(text => this.ALERT_ERROR = text);

but vs.code said me this:

@deprecated — Use an observer instead of a complete callback
@deprecated — Use an observer instead of an error callback
@deprecated — Use an observer instead of a complete callback

Can i use a better syntax ?
Thanks for help

Posts: 1

Participants: 1

Read full topic

@lsantaniello wrote:

Hi all,
I need to create a project with v3 release but when I create a new project, it has release 4.x

Is it possible to use ionic cli to create a previous release project?

Thanks
Luca

Posts: 2

Participants: 2

Read full topic

@alexmigwi wrote:

I’ve read countless forum posts but I can’t figure out what am missing in my code which gives me the error.

"ERROR Error: “Uncaught (in promise): Error: StaticInjectorError(AppModule)[Content -> NavController]: StaticInjectorError(Platform: core)[Content -> NavController]: NullInjectorError: No provider for NavController!”

Here is my code – am trying to navigate away from the login page after a successful authentication but on getting to the navCtrl.push(‘pagename’) / navCtrl.setRoot(‘Pagename’) error occurs. Pages are lazyloaded.

import { IonicPage, NavController, NavParams, LoadingController } from 'ionic-angular';

`constructor(
public navCtrl: NavController,
public navParams: NavParams,
public storage: Storage,
public loadingCtrl: LoadingController,
public formBuilder: FormBuilder,
public WPService: WpServiceProvider,
public authHandler: AuthServiceProvider
) {

this.isLoggedIn = authHandler.isLoggedIn();
this.isLoggedIn.subscribe((data) => {
  console.log(data);
});

}`

`doLogin(value) {
let loading = this.loadingCtrl.create();
loading.present();
this.authHandler.doLogin(value.username, value.password).then((result) => {
if (result) {
console.log(this);
this.navCtrl.push(“HomePage”);
loading.dismiss();

  }
  else{
    throw new Error('Login Failed...');
  }
}, (err) => {
  console.error(err);
  loading.dismiss();
  // Error log
});

}`

The rest of the code to navigate away to other pages works…

doRegister() { this.navCtrl.push("RegisterPage"); }

The result of console.log(this) inside doLogin()
{…} ​ WPService: Object { http: {…}, wposts: 1, url: "http://localhost:8100/index.php/wp-json/wp/v2/", … } ​ authHandler: Object { localStorage: {…}, http: {…}, Config: {…}, … } ​ formBuilder: Object { } ​ isLoggedIn: Object { _isScalar: false, source: {…}, operator: {…} } ​ loadingCtrl: {…} ​​ _app: Object { _disTime: 0, _scrollTime: 0, _title: "Login", … } ​​ config: Object { _c: {…}, _s: {}, _modes: {…}, … } ​​ <prototype>: Object { create: create() , … } ​ login_form: Object { pristine: false, touched: true, status: "VALID", … } ​ navCtrl: Object { _config: {…}, _elementRef: {…}, _renderer: {…}, … } ​ navParams: Object { data: {} } ​ storage: Object { _driver: "asyncStorage", _dbPromise: {…} } ​ userData: Object { token: "", user_email: "", user_nicename: "", … } ​ <prototype>: Object { ionViewWillLoad: ionViewWillLoad(), doLogin: doLogin(), goHome: goHome(), … }

Posts: 1

Participants: 1

Read full topic

@avex wrote:

I want to customize the button inside ion-item-option as Ionic3 style(full region) like.
However SHADOW show again without any --ion–xx way can be found.
So
How do you remove the padding in .native-button of <ion-item-option>?

螢幕快照 2019-03-01 上午4.02.21.png1442×612 107 KB

Hope to change paddings in class “.button-native”

Use shadow web component is not a good idea, because Ionic4 doesn’t open enough, and designed to use shadow in a HURRY.

Posts: 1

Participants: 1

Read full topic

@dev-gilbert wrote:

Hi guys, I was wondering what would be a nice implementation of a logout method, specifically which method from the navCtrl would you use?

I have this example:

 logout() {
    console.log("Logging out user");
    this.service.logout();
    this.navCtrl.navigateRoot("/welcome");
  }

But there is no animation at all, the logout method from the authService is only removing the token from the storage. Should I use navigateBack? or implement a loading or something?

Posts: 1

Participants: 1

Read full topic

@helpmelearn wrote:

I have a ion-datetime to show just month and year.

<ion-datetime displayFormat=“MMM YYYY” picker-format=“M YYYY” [min]=“minDate” [max]=“currentDate” [(ngModel)]=“reportDate” name=“reportDate”>

I also only have it go back 24 months.
Starts off with Jan 2019.
Can’t go forward anymore (no other months are available).
I change the year to 2018, but no months show up. Then I select 2017 all the months show up.
I go back to 2018 and all the months still show up. Go back to 2019 only Jan shows up. It now works going back and forth.

I have also gotten it to update months if I go to 2018, only Jan shows up. Go back to 2019, then back to 2018 all months show up sometimes.
It seems like until I scroll so far does it realize it needs to refresh. But only scrolling one item, it doesn’t fire.

What is going on? Is this normal?

Posts: 1

Participants: 1

Read full topic

@dev-gilbert wrote:

I have no idea why this is happening, but when I run my app on my iPhone using the DevApp I found a flickering effect during the transition of the navigation animation. I tested it on Android and there’s no flickering effect, neither on the browser.

As for now I only have 3 routes: welcome, login and register. In my welcome screen I have to buttons to navigate either to login or register, here’s how my welcome.ts look like:

export class WelcomePage implements OnInit {
  constructor(private navCtrl: NavController) {}

  toLogin() {
    this.navCtrl.navigateForward("/login");
  }

  toRegister() {
    this.navCtrl.navigateForward("/register");
  }

  ngOnInit() {}
}

welcome.html

<ion-content class="welcome">
  <div class="welcome__container">
    <img class="welcome__logo" src="../../../assets/img/meet-logo.png" />
    <p class="welcome__text">
      Some text goes here...
    </p>
    <div class="welcome__btns-container">
      <ion-button
        expand="block"
        shape="round"
        class="btn-light btn-mb"
        (click)="toLogin()"
      >
        Sign in
      </ion-button>
      <ion-button
        expand="block"
        shape="round"
        class="btn-gradient"
        (click)="toRegister()"
        >Sign up</ion-button
      >
    </div>
  </div>
</ion-content>

Both my login and register pages are not loading any data, they are basically forms. Any help with this issue is greatly appreciated, I have no idea what might be causing this effect on iPhone only. Thanks in advance.

Posts: 1

Participants: 1

Read full topic

@sqr08 wrote:

Only 1 of my icons are not appearing, despite the code being the exact same for all of them. The icon is appearing on my web view and an android but not on my iOS simulator.

            <ion-row class="contactRows">
              <ion-icon aria-hidden="true" class="contactIcons" src="assets/contact_us_icons/pin_icon.svg"></ion-icon>
              <ion-label class="contactInfo addressInfo">
                <a *ngIf="this.platform.is('ios'); else isAndroid" href="http://maps.apple.com/?q={{advisor.addresses[j].full}}"
                  target="_blank">
                  <ion-row> {{advisor.addresses[j].address1}} </ion-row>
                  <ion-row *ngIf="advisor.addresses[j].address2"> {{advisor.addresses[j].address2}} </ion-row>
                  <ion-row> {{advisor.addresses[j].city + ' ' + advisor.addresses[j].province + ', ' + advisor.addresses[j].postal.substring(0,3) + ' ' + advisor.addresses[j].postal.substring(3,6)}} </ion-row>
                </a>
                <ng-template #isAndroid>
                  <a href="https://maps.google.com/?q={{advisor.addresses[j].full}}" target="_blank">
                    <ion-row> {{advisor.addresses[j].address1}} </ion-row>
                    <ion-row *ngIf="advisor.addresses[j].address2"> {{advisor.addresses[j].address2}} </ion-row>
                    <ion-row> {{advisor.addresses[j].city + ' ' + advisor.addresses[j].province + ', ' +
                      advisor.addresses[j].postal.substring(0,3) + ' ' + advisor.addresses[j].postal.substring(3,6)}}
                    </ion-row>
                  </a> 
                </ng-template>
              </ion-label>
            </ion-row>

this is what the code looks like if it helps.

thanks!

Posts: 1

Participants: 1

Read full topic

@trustsolution wrote:

Hello Ionic Community

i need a help for you , i want to make screen page by using ionic 4 , the screen contains

1- div , checkbox , button

the div contains PDF File viewer , when the user read the content in this PDF , the user should press the checkbox

Now the question is ? how i can show PDF content inside the PDF File ?

Best Reagrds ,

Posts: 1

Participants: 1

Read full topic

@tanojaja wrote:

Hi guys,

I’m running into a big problem in my android builds. I can’t figure it out what is going on… Each build in v3 or v4 generates the same result, an app with a broken css.

Here is how it looks in browser

2.png636×1012 72.9 KB

1.png638×1014 33.5 KB

And this is how it looks once built

3.png624×974 99.7 KB

Ionic info:

Ionic:

ionic (Ionic CLI) : 4.3.1 (/Users/user/.nvm/versions/node/v8.9.0/lib/node_modules/ionic)
Ionic Framework : @ionic/angular 4.0.2
@angular-devkit/build-angular : 0.12.4
@angular-devkit/schematics : 7.2.4
@angular/cli : 7.2.4
@ionic/angular-toolkit : 1.4.0

Cordova:

cordova (Cordova CLI) : 8.0.0
Cordova Platforms : android 7.1.4
Cordova Plugins : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 3.1.2, (and 4 other plugins)

System:

Android SDK Tools : 26.1.1 (/Users/user/Library/Android/sdk)
NodeJS : v8.9.0 (/Users/user/.nvm/versions/node/v8.9.0/bin/node)
npm : 6.4.1
OS : macOS Sierra
Xcode : Xcode 9.2 Build version 9C40b

PD: I’ve tried the latest version of node, then downgrade to 8, rebuilding node-sass, even using another devices with android 8, 7, etc but nothing work

Posts: 1

Participants: 1

Read full topic

@Liza1201 wrote:

I am building music app now, but faced some technical issue.
I played the background music and at the same time tried to record my voice.
It’s smiliar with karaoke.
But I can’t do both of them at a time.
If I try one, then another is turned off.
Who can help me, please?

Posts: 1

Participants: 1

Read full topic

@skepticam wrote:

I want to implement this function on Ionic 4. Is there any way to do it?

Posts: 1

Participants: 1

Read full topic