@Sushil-Tango wrote:

is it possible to bundle and load external module from server in ionic app in ionic 4?

https://stackoverflow.com/questions/48683170/ionic-angular-bundle-and-load-a-dynamic-external-module-that-uses-providers-com#=

Posts: 1

Participants: 1

Read full topic

@Sushil-Tango wrote:

Is it possible to to create ionic custom library like angular library introduced from Angular 6?

Posts: 1

Participants: 1

Read full topic

@peterjc wrote:

I have ported my Ionic 3 to Ionic 4, starting with a new project and adding everything back.

In Ionic 3, I had installed the package for the wkwebview-engine. Do we need to do this or any configuration for Ionic 4? I understood it was now just included by default, but want to make sure, as I am currently getting the error…

[WKWebViewConfiguration setURLSchemeHandler:forURLScheme:]: unrecognized selector sent to instance 0x165b62a0'

When trying to run from xcode

Ionic info

Dev-Mac-mini:myapp Development$ ionic info

  Ionic:

    ionic (Ionic CLI)             : 4.12.0 (/usr/local/lib/node_modules/ionic)
    Ionic Framework               : @ionic/angular 4.4.0
    @angular-devkit/build-angular : 0.13.8
    @angular-devkit/schematics    : 7.2.4
    @angular/cli                  : 7.3.8
    @ionic/angular-toolkit        : 1.4.1

  Cordova:

    cordova (Cordova CLI) : 9.0.0 (cordova-lib@9.0.1)
    Cordova Platforms     : ios 5.0.1
    Cordova Plugins       : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 3.1.2, (and 11 other plugins)

  System:

    Android SDK Tools : 26.1.1 (/Users/Development/.android-sdk-macosx/)
    ios-deploy        : 1.9.4
    ios-sim           : 8.0.1
    NodeJS            : v10.15.3 (/usr/local/bin/node)
    npm               : 6.4.1
    OS                : macOS High Sierra
    Xcode             : Xcode 9.4.1 Build version 9F2000

My config.xml is as follows…

?xml version='1.0' encoding='utf-8'?>
  <widget android-versionCode="16" id="com.company.myapp" ios-CFBundleVersion="15" version="1.3.0.4" windows-packageVersion="1.2.6.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
      <name>myapp</name>
      <description></description>
      <author email="support@mycompany.com" href="www.mycompany.com"></author>
      <content src="index.html" />
      <access origin="*" />
      <allow-intent href="http://*/*" />
      <allow-intent href="https://*/*" />
      <allow-intent href="tel:*" />
      <allow-intent href="sms:*" />
      <allow-intent href="mailto:*" />
      <allow-intent href="geo:*" />
      <preference name="ScrollEnabled" value="false" />
      <preference name="android-minSdkVersion" value="19" />
      <preference name="deployment-target" value="10.0" />
      <preference name="WKSuspendInBackground" value="false" />
      <preference name="BackupWebStorage" value="none" />
      <preference name="SplashMaintainAspectRatio" value="true" />
      <preference name="FadeSplashScreenDuration" value="300" />
      <preference name="SplashShowOnlyFirstTime" value="false" />
      <preference name="SplashScreen" value="screen" />
      <preference name="SplashScreenDelay" value="3000" />
      <platform name="android">
          <allow-intent href="market:*" />
          <icon density="ldpi" src="resources/android/icon/drawable-ldpi-icon.png" />
          <icon density="mdpi" src="resources/android/icon/drawable-mdpi-icon.png" />
          <icon density="hdpi" src="resources/android/icon/drawable-hdpi-icon.png" />
          <icon density="xhdpi" src="resources/android/icon/drawable-xhdpi-icon.png" />
          <icon density="xxhdpi" src="resources/android/icon/drawable-xxhdpi-icon.png" />
          <icon density="xxxhdpi" src="resources/android/icon/drawable-xxxhdpi-icon.png" />
          <splash density="land-ldpi" src="resources/android/splash/drawable-land-ldpi-screen.png" />
          <splash density="land-mdpi" src="resources/android/splash/drawable-land-mdpi-screen.png" />
          <splash density="land-hdpi" src="resources/android/splash/drawable-land-hdpi-screen.png" />
          <splash density="land-xhdpi" src="resources/android/splash/drawable-land-xhdpi-screen.png" />
          <splash density="land-xxhdpi" src="resources/android/splash/drawable-land-xxhdpi-screen.png" />
          <splash density="land-xxxhdpi" src="resources/android/splash/drawable-land-xxxhdpi-screen.png" />
          <splash density="port-ldpi" src="resources/android/splash/drawable-port-ldpi-screen.png" />
          <splash density="port-mdpi" src="resources/android/splash/drawable-port-mdpi-screen.png" />
          <splash density="port-hdpi" src="resources/android/splash/drawable-port-hdpi-screen.png" />
          <splash density="port-xhdpi" src="resources/android/splash/drawable-port-xhdpi-screen.png" />
          <splash density="port-xxhdpi" src="resources/android/splash/drawable-port-xxhdpi-screen.png" />
          <splash density="port-xxxhdpi" src="resources/android/splash/drawable-port-xxxhdpi-screen.png" />
      </platform>
      <platform name="ios">
          <allow-intent href="itms:*" />
          <allow-intent href="itms-apps:*" />
          <icon height="57" src="resources/ios/icon/icon.png" width="57" />
          <icon height="114" src="resources/ios/icon/icon@2x.png" width="114" />
          <icon height="40" src="resources/ios/icon/icon-40.png" width="40" />
          <icon height="80" src="resources/ios/icon/icon-40@2x.png" width="80" />
          <icon height="120" src="resources/ios/icon/icon-40@3x.png" width="120" />
          <icon height="50" src="resources/ios/icon/icon-50.png" width="50" />
          <icon height="100" src="resources/ios/icon/icon-50@2x.png" width="100" />
          <icon height="60" src="resources/ios/icon/icon-60.png" width="60" />
          <icon height="120" src="resources/ios/icon/icon-60@2x.png" width="120" />
          <icon height="180" src="resources/ios/icon/icon-60@3x.png" width="180" />
          <icon height="72" src="resources/ios/icon/icon-72.png" width="72" />
          <icon height="144" src="resources/ios/icon/icon-72@2x.png" width="144" />
          <icon height="76" src="resources/ios/icon/icon-76.png" width="76" />
          <icon height="152" src="resources/ios/icon/icon-76@2x.png" width="152" />
          <icon height="167" src="resources/ios/icon/icon-83.5@2x.png" width="167" />
          <icon height="29" src="resources/ios/icon/icon-small.png" width="29" />
          <icon height="58" src="resources/ios/icon/icon-small@2x.png" width="58" />
          <icon height="87" src="resources/ios/icon/icon-small@3x.png" width="87" />
          <icon height="1024" src="resources/ios/icon/icon-1024.png" width="1024" />
          <splash height="1136" src="resources/ios/splash/Default-568h@2x~iphone.png" width="640" />
          <splash height="1334" src="resources/ios/splash/Default-667h.png" width="750" />
          <splash height="2208" src="resources/ios/splash/Default-736h.png" width="1242" />
          <splash height="1242" src="resources/ios/splash/Default-Landscape-736h.png" width="2208" />
          <splash height="1536" src="resources/ios/splash/Default-Landscape@2x~ipad.png" width="2048" />
          <splash height="2048" src="resources/ios/splash/Default-Landscape@~ipadpro.png" width="2732" />
          <splash height="768" src="resources/ios/splash/Default-Landscape~ipad.png" width="1024" />
          <splash height="2048" src="resources/ios/splash/Default-Portrait@2x~ipad.png" width="1536" />
          <splash height="2732" src="resources/ios/splash/Default-Portrait@~ipadpro.png" width="2048" />
          <splash height="1024" src="resources/ios/splash/Default-Portrait~ipad.png" width="768" />
          <splash height="960" src="resources/ios/splash/Default@2x~iphone.png" width="640" />
          <splash height="480" src="resources/ios/splash/Default~iphone.png" width="320" />
          <splash height="2732" src="resources/ios/splash/Default@2x~universal~anyany.png" width="2732" />
      </platform>
      <plugin name="cordova-plugin-whitelist" spec="1.3.3" />
      <plugin name="cordova-plugin-statusbar" spec="2.4.2" />
      <plugin name="cordova-plugin-device" spec="2.0.2" />
      <plugin name="cordova-plugin-splashscreen" spec="5.0.2" />
      <plugin name="cordova-plugin-ionic-webview" spec="^3.0.0" />
      <plugin name="cordova-plugin-ionic-keyboard" spec="^2.0.5" />
  </widget>

Thanks in advance for any info.

Posts: 1

Participants: 1

Read full topic

@Awaydrasil wrote:

Hello,
I recently started learning both Ionic and Angular.
This might be a stupid question but what’s the best way to change my components inside my pages ?
I mean for instance, if I have a home page where I display a surveys’ list.
Each survey clicked makes my app navigating to /survey/:surveyId

The page would be like this :

survey_sample.png560×940 16 KB

There would be a child component which is /question at the middle of the page
This would route automaticaly the URL to /survey/:surveyId/question/:currentQuestionId

When a question would be complete, I only want the “Question” component which is the rounded rect to change. I want to keep the heading title “Survey ID” and the sub-heading “Survey Category + Survey Duration”

My idea was to create the route /survey/:surveyId/question/:currentQuestionId
On question complete, I would have done router.navigate, but this would change the whole view
Or I could change to /survey/:surveyId/question/:nextQuestionId but I would have to clear the backstack and go back to /home if either back button is clicked in the toolbar or physical/virtual back button is clicked (in Android)

If I’m using backstack clearing, is it a good practice for this case ?
Or if I can only change the component, how could I do this?

Thanks,

Posts: 1

Participants: 1

Read full topic

@Maged-Abdulrahman wrote:

There seems to be an issue while viewing ion-slides with iPhone x.

1.PNG388×839 42.6 KB

2.PNG529×918 50.6 KB

Those extra white spaces are only shown with iPhone x. It’s not a responsive design issue and the second picture proves it. I used the same resolution that the iPhone x uses and got the expected behavior.

Any thoughts?

Posts: 1

Participants: 1

Read full topic

@Rupnesh wrote:

<ion-img src="/assets/shapes.svg"></ion-img>
this line of code did not help to display image (but it supported on Internet explorer not on Chrome)

Posts: 1

Participants: 1

Read full topic

@nasimta wrote:

hello
I’m new in ionic and created first app from this tutorial :
https://devdactic.com/ionic-4-image-upload-storage/
everything is working fine on serve but when I build my app with “ionic build --prod” and copy www folder on host , all of images and icons disappear in browser even ionic icons , I searched a lot in forum and tried all of paths like :

 <ion-img src = "./assets/myImage.png"></ion-img>
 <ion-img src = "../assets/myImage.png"></ion-img>
 <ion-img src = ".../assets/myImage.png"></ion-img>
 <ion-img src = "/assets/myImage.png"></ion-img>
 <ion-img src = "assets/myImage.png"></ion-img>
 <ion-img src = "../../assets/myImage.png"></ion-img>

I chacked my www folder and I can see my image there but I don’t know why browser cant find it , please tell me where i’m doing wrong , i’m using ionic 4

Posts: 1

Participants: 1

Read full topic

@madhavraveesh wrote:

Hi,
Camera is not working in ios app but it is working in android.
Ionic:

ionic (Ionic CLI) : 4.6.0 (/usr/local/lib/node_modules/ionic)
Ionic Framework : ionic-angular 3.9.4
@ionic/app-scripts : 3.2.4

Cordova:

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

System:

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

Posts: 1

Participants: 1

Read full topic

@arnestone wrote:

Hi,

Please help:
My Ionic 3 android build fails with errors on IonicWebViewEngine.java and all the camera java files (CameraLauncher.java, FileProvider.java, etc).

I have tried adding plugin cordova-android-support-gradle-release and cordova-plugin-android-support-v4 but nothing seems to work.

If I look at Android Studio SDK manager -> SDK Tools -> Support Repository I see that Android Support Repository 47.0.0 is installed.

Ionic CLI: 5.2.2 Cordova CLI: 9.0.0 Android SDK Tools: 26.1.1

Here is a link to my StackOverflow question

Posts: 1

Participants: 1

Read full topic

@akshay_kanchan wrote:

Hi,
I am new to Ionic 4, I have managed to implement a PWA using ionic 4 with Angular.
I am having a hard time figuring out how to close modals/Alerts/ActionSheets on back-button on browser (Desktop & mobile) when served as a PWA. When I press back when a modal is open, the modal stays open and background page is navigated back.
I have tried workarounds from different forums and posts like

1. this.platform.backButton.subscribeWithPriority(0, async () => {…

2. fromEvent(document, ‘backButton’).subscribe(() => {…

but none of then are working for me, please can anyone help me with this, need to go production ASAP.

Currently using : ionic : 4.6.2 Angular: 7.2.2

Posts: 1

Participants: 1

Read full topic

@MauriceNino wrote:

I have tried to disable sound with the following options:

• vibrate: false & sound: null
• silent: true
• sticky: true

None of them work and all of the combinations also dont work for me.

To clarify: It shows the notification and updates it, but it plays the system default sound on the updates.

Is there any way to disable the sound on update (I update the notification every second, because there is a timer to show on it).

Or is there an even better way/plugin to use to do this? (Show progress every second)

Posts: 1

Participants: 1

Read full topic

@aligassan wrote:

i would like to use google map including data weather json and i succeeded to getting data json from server and show marker cities on map . I am trying to make custom Google map marker , l mean l want to shows text Temperature on map not marker .

What i have in my app

3UTI0.png1080×1920 652 KB

Here simple example what i mean .

UZ8CZ.png705×466 100 KB

any idea what should l do ?

My code :

  async ngOnInit() {
    await this.platform.ready();
    await this.loadMap()

    await this.getData()
  }

      getData(){

        this.http.get('xxxxxxxxxxxxxxxxxxx',{},{}).then(data=>{

        let DataJson = JSON.parse(data.data)

        for (let datas of DataJson['features']) {

          this.points.push({ lng: datas.geometry.coordinates[0], lat: datas.geometry.coordinates[1] });

        }

        for (let i = 0; i <  DataJson.features.length; i++) {

          let coords = DataJson.features[i].geometry.coordinates;

          let latLng = new LatLng(coords[1], coords[0]);
          let icoa = DataJson.features[i].properties.id


          let markera: Marker = this.map.addMarkerSync({
            position: latLng,
            title:icoa

          })
        }



        })

      }

      loadMap() {

        let mapOptions: GoogleMapOptions = {
          camera: {
             target: {
               lat: 33.263,
               lng: 44.232
             },
             zoom: 6,
           }
        };

        this.map = GoogleMaps.create('map_canvas', mapOptions);
      }

Posts: 1

Participants: 1

Read full topic

@Caturix99 wrote:

When I compile my ionic 4 app I get this error:

ERROR in Could not resolve module ./services/services.module relative to app/app-routing.module.ts

and the simulation does not start. However, if I change something in my code and I compile once again, the code compiles successfully. I looked up that it probably has something to do with the paths (absolute/relative). But in these questions the solution was using relative paths https://github.com/angular/angular-cli/issues/8641 or in this question Angular 4 - Could not resolve submodule for routing. Since I’m already using relative paths I don’t know what to do. My folder structure in this app is => src/app/pages or services.

router.module.ts

 import { NgModule } from '@angular/core';
    import { RouterModule, Routes } from '@angular/router';

    import { TabsPage } from './tabs.page';

    const routes: Routes = [
      {
        path: 'tabs',
        component: TabsPage,
        children: [
          {
            path: 'one',
            children: [
              {
                path: '',
                loadChildren: '../one/one.module#OnePageModule'
              }
            ]
          },
          {
            path: 'two',
            children: [
              {
                path: '',
                loadChildren: '../two/two.module#TwoPageModule'
              }
            ]
          },
          {
            path: 'three',
            children: [
              {
                path: '',
                loadChildren: '../three/three.module#ThreePageModule'
              }
            ]
          },
          {
            path: 'four',
            children: [
              {
                path: '',
                loadChildren: '../four/four.module#FourPageModule'
              }
            ]
          },

          {
            path: 'five',
            children: [
              {
                path: '',
                loadChildren: '../five/five.module#FivePageModule'
              }
            ]
          },

          {
            path: '',
            redirectTo: '/tabs/one',
            pathMatch: 'full'
          }
        ]
      },
      {
        path: '',
        redirectTo: '/tabs/one',
        pathMatch: 'full'
      }
    ];

    @NgModule({
      imports: [RouterModule.forChild(routes)],
      exports: [RouterModule]
    })
    export class TabsPageRoutingModule {}

app-routing.module.ts

import { NgModule } from '@angular/core';
import { PreloadAllModules, RouterModule, Routes } from '@angular/router';

const routes: Routes = [
  { path: '', loadChildren: './tabs/tabs.module#TabsPageModule' },
  { path: 'one', loadChildren: './one/one.module#OnePageModule' },
  { path: 'filter', loadChildren: './filter/filter.module#FilterPageModule' },
  { path: 'four', loadChildren: './four/four.module#FourPageModule' },
  { path: 'key', loadChildren: './key/key.module#KeyPageModule' },
  { path: 'test', loadChildren: './test/test.module#TestPageModule' },
  { path: 'notifications', loadChildren: './notifications/notifications.module#NotificationsPageModule' },
  { path: 'three', loadChildren: './three/three.module#ThreePageModule' },
  { path: 'five', loadChildren: './five/five.module#FivePageModule' },
  { path: 'two', loadChildren: './two/two.module#TwoPageModule' },
  { path: 'services', loadChildren: './services/services.module#ServicesPageModule' },
  { path: 'settings', loadChildren: './settings/settings.module#SettingsPageModule' },
  { path: 'login', loadChildren: './login/login.module#LoginPageModule' },
  { path: 'signup', loadChildren: './signup/signup.module#SignupPageModule' },
  { path: 'friprofile', loadChildren: './friprofile/friprofile.module#FriprofilePageModule' },
  { path: 'four/:id', loadChildren: './four-details/four-details.module#FourDetailsPageModule' },   
  { path: 'two-details', loadChildren: './two-details/two-details.module#TwoDetailsPageModule' },
  { path: 'choose', loadChildren: './choose/choose.module#ChoosePageModule' },
  { path: 'camfilter', loadChildren: './camfilter/camfilter.module#CamfilterPageModule' }
//Changed from four-details -> four/:id
];
@NgModule({
  imports: [
    RouterModule.forRoot(routes, { preloadingStrategy: PreloadAllModules })
  ],
  exports: [RouterModule]
})
export class AppRoutingModule {}

Posts: 1

Participants: 1

Read full topic

@BrenoP wrote:

I have a post method trying to login asp net api, but i need to set a cookie in this post method to get the authorization. When i try the request in postman, i can see the cookie
this is my request code:

login(email: string, senha: string) {
return this.http.post(${API}/Login/Login, {email: email, senha: senha}, {withCredentials: true})
}

I tryed this withCredentials, but it doesn’t work

Posts: 1

Participants: 1

Read full topic

@derman10 wrote:

In my development PC I have the whole environment to develop Ionic 3 applications, which I must keep working.

If I wanted to develop a new app with Ionic 4, how would I have to do it? Could I still maintain the development environment for Ionic 3? Can both versions of Ionic coexist in the same PC?

How would I have to do?

Best Rgs.

Posts: 1

Participants: 1

Read full topic

@DMoney wrote:

I’m unable to deploy my app to an iOS device or emulator. It just displays the initial splash screen and when the splash screen is hidden it just displays a white screen. The same thing happens in the ios emulator and ios device. This does not happen with Android, I can deploy to a device and emulator. This is virtually impossible to troubleshoot because if I ionic serve and check the console log in the browser there aren’t any errors. I can inspect the ios device to look for errors so I’m shooting blindly.

I have the latest version of xCode and MAC.
npm -v 6.9.0

If i create a blank project I can deploy to an emulator successfully.

Initially I wasn’t able to test on iOs. My OS had issues that forced me to format and upgrade to the latest MAC version. I push my code to GITHUB then cloned locally after MAC OS upgrade and did an NPM install.

Any help would be greatly appreciated. I don’t even know how to begin troubleshooting

tmnlx.png718×1534 24 KB

Posts: 1

Participants: 1

Read full topic

@lolo12 wrote:

Hello everybody. This is my first time to use the forum/ask a question here, and I hope anyone can help me with this problem. Currently I’m using Ionic 4 with Angular.

I want to have an image when I click it, audio will be played(mp3/wav). I’ve been struggling on it for a week now. Can you help me with the following? What are my options to play audio file in ionic 4, and how to play my audio file in the app?

Posts: 1

Participants: 1

Read full topic

@danielmm1997 wrote:

Hello,

i have a Problem with the current Ionic 4 Version.

The ionBlur Event with a Range Slider is not firing when the Knob is released. Only when i click somewhere on the Screen it is working.

Best,
Daniel

Posts: 1

Participants: 1

Read full topic

@PterPmnta wrote:

Hi every one in the community, i will want to know if is possible have one o multiples realationship in a database local in my phone. For example:

If i will decided use create the tables:

Provider

Id
Name

Product

id_pro
Name_pro
id_provider(FK)

Sell_detail

id
Quantity
Package
Id_Product(FK)
Id_Sell(FK)

Sell

Id
Type
State

I would like to know how advisable it is, if it could generate problems when you have large amounts of data, if in the long term it becomes very slow, or if nothing of that happens.

Posts: 1

Participants: 1

Read full topic

@PterPmnta wrote:

Hi community, i worked with Ionic v1 long time ago, but i will want back to develop with this framwork. The problem or my situation is, the angular is not the same, i know the angular 8, is just a number, is a evolution to angular 2, but in my case i don’t code in so much time i want to know the next:

1. Is necesary pass across to angular 2,3,5,6,7 before start with angular 8?
2. If don’t development using Ionic v2 and v3, can begin with ionic v4?
3. What is Stencil or Capacitor?, Should to be a consideration that?
4. Ionic use angular as the primary languaje, but now support, React, Vue, PWA and Electron. Today they are no longer in React and Vue beta phase?

I will appreciate any help community, thanks.

Posts: 1

Participants: 1

Read full topic