@michaelkariv wrote:

I am using ngrx (redux like) library as a core of my app.
I have effects (an ngrx term, something that listens to system-wide “actions” and react to some of them) that operate “api service”. the api service is simple - it just sends data back and force to server. Effects on the other hand dispatch “actions” of their own. For example, a ui component on a login form sends action “login” with payload of email and password. A corresponding effect gets it, calls the api service, gets response with a token, dispatches “login success” action.
So far so good, but sometimes a user misspelled an email - and api service returns an error. My question - should an effect deal with it - by prompting a Router or app’s root nav control to display a popup error message - or should it be left for a component to do?
An advantage of doing it in effect would be - using same error ui control universally, handling the error where it happened - and keeping components like login form true to its purpose - gathering user input.

In the past Mike answered a somewhat similar question in the past.

But ngrx effects are not your regular service - it is more of like a business logic for the app, it seems to me - so does this logic still apply? I know it is as much of an ngrx question as it is ionic one. In fact ngrx sample app does just that - manages navigation in an effect - by calling injected Router methods.

What makes me want to ask this question here anyway is that ionic was in many ways prescriptive of the best practices and I want to be a good ionicdom citizen in this regard.

Posts: 1

Participants: 1

Read full topic

@ramashishb wrote:

Hi,

I am running into CORS issue on Android simulator. I have set ‘Accests-Control-Allow-Origin’ to ‘*’ to enable CORS on my APIs, but am getting the following error:

A wildcard ‘*’ cannot be used in the ‘Access-Control-Allow-Origin’ header when the credentials flag is true. Origin ‘http://localhost’ is therefore not allowed access

I am using {withCredentials: true} in the post method, without this the HTTP session on my server didn’t seem to work.

My environment:

cli packages: (/usr/lib/node_modules)

@ionic/cli-utils  : 1.19.2
ionic (Ionic CLI) : 3.20.0

global packages:

cordova (Cordova CLI) : 8.0.0 

local packages:

@ionic/app-scripts : 3.2.1
Cordova Platforms  : android 7.0.0
Ionic Framework    : ionic-angular 3.9.3

System:

Android SDK Tools : 26.1.1
Node              : v8.14.0
npm               : 6.4.1 
OS                : Linux 4.10

Environment Variables:

ANDROID_HOME : /home/ramashishb/Android/Sdk

Misc:

backend : pro

Any idea whats wrong?

Thanks,
Ramashish

Posts: 1

Participants: 1

Read full topic

@lunneyd wrote:

I have map displaying but if I scroll down it covers all the phone page sometimes so I can’t scroll up or down as instead it the the map that scrolls rather than the screen. Any ideas what to do.

Posts: 1

Participants: 1

Read full topic

@thomasmd wrote:

Hello everyone, i need some help with my ionic projet.
I use Youtube Api to get a video Id and then open the video with InAppBrowser plugin.

It’s works with my browser and the ionic dev app. But not when i build my ipa file and run it on my ios device.

My configuration :

Ionic:

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

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 9 other plugins)

System:

   ios-deploy : 1.9.4
   NodeJS     : v10.15.0 (/usr/local/bin/node)
   npm        : 6.4.1
   OS         : macOS Mojave
   Xcode      : Xcode 10.1 Build version 10B61

My provider :

public fetchTrailer(mediaTitle: string) {
    console.log("IN FETCH");
    
    let searchText: string = mediaTitle + " bande annonce";
    let url: string = YOUTUBE_API_URL +"search?maxResult=" +"1" +"&key=" +YOUTUBE_API_KEY +"&part=snippet&q=" +searchText;
    console.log("URL " + url);
    return new Promise (resolve => {
      this.http
      .get(
        YOUTUBE_API_URL +
        "search?maxResult=" +
        "1" +
        "&key=" +
        YOUTUBE_API_KEY +
        "&part=snippet&q=" +
        searchText
      ).subscribe(
        data => {
          resolve(data);
      },
      err => {
        console.log(err);
      }
      );
    });
  }

Xcode console error :

{"headers":{"normalizedNames":{},"lazyUpdate":null,"headers":{}},"status":0,"statusText":"Unknown Error","url":null,"ok":false,"name":"HttpErrorResponse","message":"Http failure response for (unknown url): 0 Unknown Error","error":{"isTrusted":true}}

Thanks a lot

Posts: 1

Participants: 1

Read full topic

@cdwebinfo wrote:

This error comes due to NDK version mismatch, To resolve this error you have to download an older version of NDK and need to remap NDK path. Then you can build the project successfully. To do this please follow the below steps provided on below URL -

Posts: 1

Participants: 1

Read full topic

@vance wrote:

Absolutely, 100% no firebase-messaging in our src config.xml, plugins.xml, or any of our package.json or dependencies. I do find a reference in the AndroidManifest in node_modules/@capacitor/android/capacitor/src/main/AndroidManifest Isn’t Capacitor part of the Ionic tooling? This dependency is breaking gradle at build time, and I’m unsure of how to remove this dependency since it is part of Capacitor. I opened an issue with more details: https://github.com/ionic-team/ionic/issues/17816

Posts: 1

Participants: 1

Read full topic

@scattana wrote:

Hi all! New to ionic and app development, though I’ve done quite a bit of work with networking and I’m familiar with web dev.

Trying to run a sample Ionic (v3) project which I set up on my Linux remote server (ubuntu distribution). I’m using the command “sudo ionic serve” and it seems to be lauching the development server (says “browser window opened to localhost:8100”), but I can’t connect through my browser (using Chrome on Windows 10).

I’m connecting to my linux server through PuTTY, and I’ve enabled port forwarding to localhost:8100. I’ve also tried several other ports (and specified the “–port=XYZ” option), but still get “could not connect” in my browser.

I’ve used remote port forwarding for other projects before with this same OS and browser (Chrome) without issues, so I’m confused why I can’t connect with this new ionic project, especially when the ionic development server is clearly running. Any help would be greatly appreciated, thank you!

Posts: 1

Participants: 1

Read full topic

@wekas wrote:

I am displaying an image in a modal.
It works fine on web but on an Android device it only intermittently shows the image (otherwise it shows a no image placeholder).
If I get closing and reopening the modal / image by clicking on the thumbnail, about 25% of the time it shows the image ok.

I figure its something to do with the async loading of the base64 image data I am passing in as a parameter. Any ideas to fix this?

<ion-content class="content-modal">
  <div class="content-inner">
      <ion-img [src]="imageDataUrl" (click)="onCloseModal()"></ion-img>
  </div>
</ion-content>

export class ViewImageComponent implements OnInit {
  @Input() imageDataUrl: string;

  constructor(private modalCtrl: ModalController) { }

  ngOnInit() {
  }

  onCloseModal() {
    this.modalCtrl.dismiss();
  }

}

Posts: 1

Participants: 1

Read full topic

@vcjoo wrote:

FitModalPage is my modal-page

import { Component, OnInit } from '@angular/core';

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

  constructor() { }

  ngOnInit() {
    console.log(`fit modal page`);
  }

}

i saw this log ‘fit modal pge’ in chrome debug console
but, not showing modal popup display !!

add to fit-modal in entryComponents
add to fit-modal in declarations …

perfect ! can not find error !!
why not showing modal page ?

Posts: 2

Participants: 2

Read full topic

@Oliziplok wrote:

Hi,

I have a probleme with diplaying base64 images.

When I upload an image from the camera in a base64 format i’m able to displays it via ionic devapp but when I build it from Xcode and run it natively on my ios device, the image is shown as a broken image.

Does somebody have an explanation?

Thanks!

Posts: 3

Participants: 3

Read full topic

@8bhsolutions wrote:

Hi,

I’ve writing a Ionic App that uses several plugins (which are supported on by DevApp).
Testing via the browser works fine.
Testing via Emulator also works fine.

When I test the app via DevApp, the ionic console is logging that the plugins are not installed.

Anyone know how to resolve this?

Posts: 1

Participants: 1

Read full topic

@vasanthb wrote:

Hi,
I have a project, that was build on version Ionic 3. I have not updated my CLI to Ionic 4, as it is not necessary to me . Now after I install any plugin it says, greater version of the ionic-core or angular-core required. Ex: If I run

ionic cordova plugin add cordova-plugin-media-capture
npm install @ionic-native/media-capture

I get a warning like

npm WARN @ionic-native/media@5.3.0 requires a peer of @ionic-native/core@^5.1.0 but none is installed. You must install
peer dependencies yourself.
npm WARN @ionic-native/media-capture@5.3.0 requires a peer of rxjs@^6.3.0 but none is installed. You must install peer dependencies yourself.npm WARN @ionic-native/media-capture@5.3.0 requires a peer of @ionic-native/core@^5.1.0 but none
is installed. You must install peer dependencies yourself.

If I try to update ionic-core some other plugins will throw warning saying they need older version of the ionic-core.
Also there is some changes on the import statement where ngx is used

import { MediaCapture, MediaFile, CaptureError, CaptureImageOptions } from '@ionic-native/media-capture/ngx';

But when I try to use the plugin with below code

let options: CaptureImageOptions = { limit: 3 }
this.mediaCapture.captureImage(options)
  .then(
    (data: MediaFile[]) => console.log(data),
    (err: CaptureError) => console.error(err)
  );

I will get error like uncaught type error object(…) is not a function. This is been common for most of the plugins, I’m not able to use any plugin from few days. Please help me by saying, what is the mistake that I’m doing.

Posts: 1

Participants: 1

Read full topic

@ionictgraj wrote:

Ionic:

ionic (Ionic CLI) : 4.12.0 (C:\Users\user\AppData\Roaming\npm\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 : browser 5.0.4
Cordova Plugins : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 3.1.2, (and 6 other plugins)

System:

Android SDK Tools : 26.1.1 (C:\Users\user\AppData\Local\Android\Sdk)
NodeJS : v8.11.1 (C:\Program Files\nodejs\node.exe)
npm : 6.4.1
OS : Windows 10

I build the app using ionic cordova build browser --prod

saw ‘www’ and copied the content into my web browser(IIS) root folder and only blank screen can be seen

but i can run the web page when using ionic cordova run browser.

Is there any specific setting/plugin required to run this www contents in IIS or any othere web server?

Posts: 1

Participants: 1

Read full topic

@karthikaivel wrote:

Hi,
I need to sqlite storage usages but here show the error.how to remove that.

image.png1366×768 190 KB

sqlite coding for given image

image.png1366×768 176 KB

Please clearify me.how to sqlite usages?

Posts: 1

Participants: 1

Read full topic

@hasnainsakir001 wrote:

Hi,
Am trying to Integrate the Facebook SDK in my ionic app for App events tracking. Currently am following the steps mentioned in my developers account, but its not working .
it Shows “Could not find method implementation() for arguments [com.facebook.android:facebook-android-sdk:4.26.0]”.
can i get to know if its possible to implement facebook events tracking in ionic app ?. And whats the best method to do so.
Thanks in advance

Posts: 1

Participants: 1

Read full topic

@ubaidgul wrote:

ion-range not changing direction RTL and also don’t move the slider.

Posts: 1

Participants: 1

Read full topic

@JeongJun wrote:

I am using this version below.

“@ionic/angular”: “^4.1.0”,
“cordova-android”: “7.1.0”,

When I make android version by “ionic cordova run android”, the error emits.

Could not resolve all files for configuration ‘:app:debugCompileClasspath’.

Could not find support-compat.jar (com.android.support:support-compat:27.1.1).
Searched in the following locations:
https://jcenter.bintray.com/com/android/support/support-compat/27.1.1/support-compat-27.1.1.jar

Posts: 1

Participants: 1

Read full topic

@LacOniC wrote:

There are some topics about this problem but they are outdated. I use Ionic 4.1.1.

When i navigate between tabs, NgOnInit does not fire second time. It only works once. So if i change a data in tab 2, tab 1 can’t get it. For example a tab has no any event like ionSelect or ionChange. Because there is no Ion-Tab anymore. Ion-Tabs component has ionTabsDidChange but it’s useless in tab pages as i understand.

How can i trigger NgOnInit second time or call a function in a tab page when tab change?

Thanks in advance.

Posts: 2

Participants: 1

Read full topic

@christopherchu96 wrote:

I am using ionic framework to develop an app in Android and Ios environment. There is a chart in my app which is a line chart showing continuous data over datetime. I employed Chartjs for the graph. The line chart works well in android/ web platform but fail in ios. Could anyone know the reasons behind? many thanks.

Here is the code for reference. this.SBP_line and this.DBP_line are the data pass to the chart. They are in array format. e.g.[{x: “2019-03-13 0:19:47”, y: 130}]

Chart in web/ Android

Screenshot 2019-03-20 at 5.42.03 PM.png710×648 54.3 KB

Chart in IOS

IMG_3470.jpg1125×1179 162 KB

createLineChart(): void {
  //   Chart.scaleService.updateScaleDefaults('linear', {
  //   ticks: {
  //     min: 0,
  //     max: 50, 
  //   }
  // });
  this.lineChartEl = new Chart(this.lineChart.nativeElement, {
    type: 'line',
    data: {
      // labels: this.datetime,
      datasets: [{
          label: 'Systolic Blood Pressure',
          data: this.SBP_line,
          duration: 2000,
          easing: 'easeInQuart',
          backgroundColor: "red",
          borderColor: 'red',
          hoverBackgroundColor: this.chartHoverColours,
          fill: false,
          pointRadius: 5,
          pointHoverRadius: 10,
        },
        {
          label: 'Diastolic Blood Pressure',
          data: this.DBP_line,
          duration: 2000,
          easing: 'easeInQuart',
          backgroundColor: "green",
          borderColor: 'green',
          hoverBackgroundColor: this.chartHoverColours,
          fill: false,
          pointRadius: 5,
          pointHoverRadius: 10,
        }

      ]
    },
    options: {
      hover: {
        mode: null
      },
      pan: {
        // Boolean to enable panning
        enabled: false,

        // Panning directions. Remove the appropriate direction to disable 
        // Eg. 'y' would only allow panning in the y direction
        mode: 'x'
      },

      // Container for zoom options
      zoom: {
        // Boolean to enable zooming
        enabled: false,

        // Zooming directions. Remove the appropriate direction to disable 
        // Eg. 'y' would only allow zooming in the y direction
        mode: 'x',

        limits: {
          max: 10,
          min: 0.5
        }
      },
      responsive: true,
      maintainAspectRatio: false,

      legend: {
        display: true,
        boxWidth: 80,
        fontSize: 15,
        padding: 0,
        labels: {
          fontColor: "white",
          fontSize: 18
        }
      },
      scales: {
        yAxes: [{
          ticks: {
            fontColor: "white",
            fontSize: 18,
            beginAtZero: true,
            stepSize: 30,
            max: 240,
            min: 30,
          },
          gridLines: {
            color: 'white',
            lineWidth: 1
          }
        }],
        xAxes: [{
          type: 'time',
          time: {
            min: new Date(this.datetime[-1]).getTime(),
            max: new Date(this.datetime[0]).getTime(),
            unit: 'day',
            unitStepSize: 1,
            displayFormats: {
              'day': 'DD MMM '
            }
          },
          ticks: {
            fontColor: "white",
            fontSize: 18,
            autoSkip: true
          },
          gridLines: {
            color: 'transparent',
            lineWidth: 1
          }
        }]
      }
    }
  });
}

Posts: 1

Participants: 1

Read full topic

@demokumar wrote:

My projects info is

ionic (Ionic CLI) : 4.10.2 (C:\Users\User\AppData\Roaming\npm\node_modules\ionic)
Ionic Framework : ionic-angular 2.0.0-rc.4
@ionic/app-scripts : 1.0.0

Cordova:

cordova (Cordova CLI) : 7.1.0
Cordova Platforms : android 6.0.0
Cordova Plugins : no whitelisted plugins (16 plugins total)

System:

Android SDK Tools : 26.0.2 (D:\common\kapil\Android\sdk)
NodeJS : v6.11.1 (C:\Program Files\nodejs\node.exe)
npm : 5.3.0
OS : Windows 8.1

not display status bar notification when app in background

Posts: 1

Participants: 1

Read full topic