Hello! Since UIWebView is being deprecated and that cordova ios 6 is still under night builds, I am trying to completely move an ionic cordova app to use WKWebView.

I did follow this tutorial:
https://cordova.apache.org/howto/2020/03/18/wkwebviewonly.html

I am using cordova ios 5.1.1

Here is the list of the cordova plugins I currently have installed in the project:

accuv-call-push-monitor 1.0.0 "AccuvCallPushMonitor"
cordova-android-support-gradle-release 3.0.1 "cordova-android-support-gradle-release"
cordova-custom-config 5.1.0 "cordova-custom-config"
cordova-plugin-android-permissions 1.0.2 "Permissions"
cordova-plugin-app-update 2.0.2 "AppUpdate"
cordova-plugin-app-version 0.1.9 "AppVersion"
cordova-plugin-appcenter-analytics 0.1.9 "App Center Analytics for Cordova"
cordova-plugin-appcenter-crashes 0.1.9 "App Center Crashes for Cordova"
cordova-plugin-appcenter-push 0.1.9 "App Center Push for Cordova"
cordova-plugin-appcenter-shared 0.1.9 "App Center shared code for Cordova"
cordova-plugin-appversion 1.0.0 "App Version"
cordova-plugin-badge 0.8.8 "Badge"
cordova-plugin-camera 4.1.0 "Camera"
cordova-plugin-certificates 0.6.4 "Certificate Plugin"
cordova-plugin-compat 1.2.0 "Compat"
cordova-plugin-console 1.1.0 "Console"
cordova-plugin-customurlscheme 4.4.0 "Custom URL scheme"
cordova-plugin-device 2.0.3 "Device"
cordova-plugin-file 6.0.2 "File"
cordova-plugin-file-opener2 2.2.1 "File Opener2"
cordova-plugin-file-transfer 1.7.1 "File Transfer"
cordova-plugin-geolocation 4.0.2 "Geolocation"
cordova-plugin-inappbrowser 3.2.0 "InAppBrowser"
cordova-plugin-ionic-keyboard 2.2.0 "cordova-plugin-ionic-keyboard"
cordova-plugin-ionic-webview 5.0.0 "cordova-plugin-ionic-webview"
cordova-plugin-local-notification 0.9.0-beta.2 "LocalNotification"
cordova-plugin-media 5.0.3 "Media"
cordova-plugin-opentok 3.4.3 "OpenTokCordovaPlugin"
cordova-plugin-printer 0.7.3 "Printer"
cordova-plugin-request-location-accuracy 2.3.0 "Request Location Accuracy"
cordova-plugin-screen-orientation 3.0.2 "Screen Orientation"
cordova-plugin-speechrecognition 1.1.2 "Speech Recognition"
cordova-plugin-splashscreen 4.1.0 "Splashscreen"
cordova-plugin-statusbar 2.4.3 "StatusBar"
cordova-plugin-video-capture-plus 1.0.0 "VideoCapturePlus"
cordova-plugin-video-editor 1.1.3 "VideoEditor"
cordova-plugin-voippush 0.0.1 "VoipPush"
cordova-plugin-whitelist 1.3.4 "Whitelist"
cordova-plugin-wkwebview-engine 1.2.1 "Cordova WKWebView Engine"
cordova-plugin-x-toast 2.7.2 "Toast"
cordova-support-google-services 1.3.1 "cordova-support-google-services"
cordova.plugins.diagnostic 4.0.12 "Diagnostic"
ionic-plugin-keyboard 2.2.1 "Keyboard"
phonegap-plugin-barcodescanner 7.1.2 "BarcodeScanner"
phonegap-plugin-push 2.2.3 "PushPlugin"

I also did update the config.xml file to use only WKWebView:

        <!-- WKWebView stuff -->
        <preference name="WKWebViewOnly" value="true" />
        <feature name="CDVWKWebViewEngine">
            <param name="ios-package" value="CDVWKWebViewEngine" />
        </feature>
        <preference name="CordovaWebViewEngine" value="CDVWKWebViewEngine" />

I then entered the following commands:

ionic build;
ionic cordova platform add ios;
ionic cordova prepare;
ionic cordova build ios;

I then get the following:

** ARCHIVE FAILED **


The following build commands failed:
	Ld /Users/vittoriopassuello-dussault/Library/Developer/Xcode/DerivedData/AccuV-afsbvdwyobxxpmfpiryucawybsqq/Build/Intermediates.noindex/ArchiveIntermediates/AccuV/InstallationBuildProductsLocation/Applications/AccuV.app/AccuV normal arm64
(1 failure)
xcodebuild: Command failed with exit code 65

When I open the project in XCode, and try to build, I get this error:

14 duplicate symbols for architecture arm64

I figured out that this plugin could also use libraries used by the cordova-plugin-ionic-webview hence this issue.

I was wondering if anyone have been able to actually get rid of UIWebView in favour of WKWebView. There is no sign of a cordova ios 6 release date and we are kind of stressing out.

Thank you for your support!

UPDATE:

I installed the following plugin

cordova plugin add cordova-plugin-wkwebview-file-xhr

And now I am getting this error

Undefined symbols for architecture arm64:
  "_OBJC_CLASS_$_CDVWKProcessPoolFactory", referenced from:
      objc-class-ref in CDVWKInAppBrowser.o

1 post - 1 participant

Read full topic

I’m working with Ionic v5 and Angular 9 for a mobile project and I’ve added a input for address. The autocomplete on the input works great and I can change styles on the browser and I get to customize the google places input just like I want, but If I go into my scss file and change the classes that google provide in their documentation (same classes I changed on the browser with no problem) those styles just never show up. Any ideas on how to solve this? I followed this and this to check to which classes to change their style, but again, If I write them on my scss file, they just wont show up.

profile.page.html

<ion-item class="br-5 mt">
   <ion-icon name="home" slot="start" class="ion-align-self-center" color="primary"></ion-icon>
   <ion-input id="googlePlaces" placeholder="Dirección" formControlName="address" required type="text"></ion-input>
</ion-item>

profile.page.scss

.pac-container{
    font-family: 'Open Sans';
}
.pac-item{

    margin-left:10px;
}

.pac-icon{
    display:none;
}

.pac-logo:after{
    display:none;
}

1 post - 1 participant

Read full topic

Hi everyone I am new to Ionic. I am working on a personal project and using tabs. I am finding it difficult to route the automatically generated tabs to a newly generated page. Does anyone have any tutorials or advice on Routing within Tabs.

Thanks

1 post - 1 participant

Read full topic

Hi everyone,
is it possible to insert a picker inside a div and not have it externally?

thanks

1 post - 1 participant

Read full topic

I am a beginner - I have installed ionic v 6.9.1 , cordova 9.0.0 and capacitor and am ready to learn building Apps. Can someone tell me if I need both cordova and capacitor . If not necessary to have both, which is best to have? I am eager to get started - thanks in advance.
2020-05-28T22:00:00Z

1 post - 1 participant

Read full topic

HI!

I’ve been successful in using OpenLayers 5 with Ionic but when upgrading to OpenLayers 6 it doesn’t work.

I can see the map but all controls are in the upper left corner and I can’t scroll or zoom in the map!

Do anyone know of an example using OpenLayers 6 with ionic?

2 posts - 1 participant

Read full topic

I developped a post methode in API (coded on ASP.NET)

  // POST api/<controller>
        public string Post([FromBody]string id) //add user
        {
            using (BDPLMProjectENEntities db = new BDPLMProjectENEntities())
            {
                membre mem = db.membres.Where(model => model.IDmembre == id).FirstOrDefault();
                usersProject usr = db.usersProjects.Where(model => model.IDressource == id).FirstOrDefault<usersProject>();
                if (usr == null)
                {
                    
                    ajouterUtilisateur(mem, true);
                    return "user added";
                    
                }
                else
                {
                    return "This member already belongs to users." ;
                }

            }
        }

This is post method in rest.service.ts from Ionic app:

addUser(id){
  
  let body = {"id":id};   
 console.log(body);    
return this.http.post(this.apiUrl +'/Resource',JSON.stringify(body),this.httpOptions).map(res=>res.toString());      

}

and this is where I call the post method from users.page.ts

 let alert = await this.alertCtrl.create({
        header : 'Choose one',
        inputs : radio_options ,
        buttons: [
          {
            text: 'Cancel',
            role: 'cancel',
            handler: () => {
              console.log('Cancel clicked');
            }
          },
          {
            text: 'Ok',
            handler: data => {//data: id user
             this.iduser=data;
             console.log( this.iduser);
           this.api.addUser(this.iduser).subscribe( data=>{ //data from api=result of add user
            console.log(data)
            });
          }
          }
        ]
    });
    
  await alert.present();

the problem is when I test in the API I get the id is null however I put the right id and you can see it in the console.log in rest.service.ts and users.page.ts

This is from visual studio (web API)

image804×192 14.9 KB

1 post - 1 participant

Read full topic

On android, styles no longer apply.
Until a certain point, everything worked fine, but after adding new functionality - without new page. On one device ( android 7), some of the styles are not applied.

C9F48604-32D1-4224-9093-FA3BCAA7D9B91536×2048 412 KB

these pages used to display normally.
That’s what they should look like

profile449×854 26.4 KB

ionic info:

Ionic:

Ionic CLI : 6.9.2 (C:\Users\my\AppData\Roaming\nvm\v10.13.0\node_modules@ionic\cli)
Ionic Framework : @ionic/angular 4.11.10
@angular-devkit/build-angular : 0.13.8
@angular-devkit/schematics : 7.3.9
@angular/cli : 7.3.9
@ionic/angular-toolkit : 1.5.1

Capacitor:

Capacitor CLI : 1.0.0-beta.24
@capacitor/core : 1.0.0-beta.24

Cordova:

Cordova CLI : 9.0.0 (cordova-lib@9.0.1)
Cordova Platforms : android 8.1.0
Cordova Plugins : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 4.1.3, (and 33 other plugins)

Utility:

cordova-res : not installed
native-run : 1.0.0

System:

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

ionic cordova plugin ls:

call-number 0.0.2 “Cordova Call Number Plugin”
com-badrit-base64 0.2.0 “Base64”
cordova-android-support-gradle-release 3.0.1 “cordova-android-support-gradle-release”
cordova-open-native-settings 1.5.2 “Native settings”
cordova-plugin-advanced-http 2.1.1 “Advanced HTTP plugin”
cordova-plugin-background-fetch 5.5.0 “CDVBackgroundFetch”
cordova-plugin-background-service 1.3.5 “cordova-plugin-background-service”
cordova-plugin-badge 0.8.8 “Badge”
cordova-plugin-camera 4.1.0 “Camera”
cordova-plugin-chooser 1.2.5 “Chooser”
cordova-plugin-crop 0.3.1 “CropPlugin”
cordova-plugin-datepicker 0.9.3 “DatePicker”
cordova-plugin-device 2.0.2 “Device”
cordova-plugin-external-storage 1.0.0 “External storage”
cordova-plugin-file 6.0.1 “File”
cordova-plugin-file-opener2 2.2.1 “File Opener2”
cordova-plugin-file-transfer 1.7.1 “File Transfer”
cordova-plugin-filechooser 1.2.0 “File Chooser”
cordova-plugin-filepath 1.5.5 “cordova-plugin-filepath”
cordova-plugin-filepicker 1.1.6 “File Picker”
cordova-plugin-geolocation 4.0.2 “Geolocation”
cordova-plugin-inappbrowser 3.1.0 “InAppBrowser”
cordova-plugin-ionic-keyboard 2.1.3 “cordova-plugin-ionic-keyboard”
cordova-plugin-ionic-webview 4.1.3 “cordova-plugin-ionic-webview”
cordova-plugin-ios-camera-permissions 1.2.0 “iOS Permissions”
cordova-plugin-local-notification 0.9.0-beta.2 “LocalNotification”
cordova-plugin-mauron85-background-geolocation 3.0.7 “CDVBackgroundGeolocation”
cordova-plugin-network-information 2.0.1 “Network Information”
cordova-plugin-request-location-accuracy 2.3.0 “Request Location Accuracy”
cordova-plugin-screen-orientation 3.0.2 “Screen Orientation”
cordova-plugin-settings-hook 0.2.7 “Cordova Settings Hooks”
cordova-plugin-splashscreen 5.0.2 “Splashscreen”
cordova-plugin-statusbar 2.4.2 “StatusBar”
cordova-plugin-telerik-imagepicker 2.3.3 “ImagePicker”
cordova-plugin-websql 0.0.10 “Web SQL plugin”
cordova-plugin-whitelist 1.3.4 “Whitelist”
cordova-sqlite-storage 5.0.0 “Cordova sqlite storage plugin - cordova-sqlite-storage plugin version”
cordova.plugins.diagnostic 5.0.1 “Diagnostic”
es6-promise-plugin 4.2.2 “Promise”
phonegap-plugin-barcodescanner 8.1.0 “BarcodeScanner”
sentry-cordova 0.17.0 “Sentry”

npm list --depth=0

±- @agm/core@1.0.0
±- @angular-devkit/architect@0.13.8
±- @angular-devkit/build-angular@0.13.8
±- @angular-devkit/core@7.3.9
±- @angular-devkit/schematics@7.3.9
±- @angular/cli@7.3.9
±- @angular/common@7.2.14
±- @angular/compiler@7.2.14
±- @angular/compiler-cli@7.2.14
±- UNMET PEER DEPENDENCY @angular/core@7.2.14
±- @angular/forms@7.2.14
±- @angular/http@7.2.14
±- @angular/language-service@7.2.14
±- @angular/platform-browser@7.2.14
±- @angular/platform-browser-dynamic@7.2.14
±- @angular/router@7.2.14
±- @capacitor/cli@1.0.0-beta.24
±- @capacitor/core@1.0.0-beta.24
±- @ionic-native/background-geolocation@5.17.1
±- @ionic-native/barcode-scanner@5.19.1
±- @ionic-native/base64@5.12.0
±- @ionic-native/call-number@5.13.0
±- @ionic-native/camera@5.25.0
±- @ionic-native/chooser@5.14.0
±- UNMET PEER DEPENDENCY @ionic-native/core@5.5.1
±- @ionic-native/crop@5.6.0
±- @ionic-native/date-picker@4.20.0
±- @ionic-native/diagnostic@5.20.0
±- @ionic-native/document-viewer@5.5.1
±- @ionic-native/file@5.0.0
±- @ionic-native/file-chooser@5.14.0
±- @ionic-native/file-opener@5.5.1
±- @ionic-native/file-path@5.0.0
±- @ionic-native/file-picker@5.18.0
±- @ionic-native/file-transfer@5.18.0
±- @ionic-native/geolocation@5.13.0
±- @ionic-native/http@5.11.0
±- @ionic-native/image-picker@5.20.0
±- @ionic-native/in-app-browser@5.14.0
±- @ionic-native/ionic-webview@5.6.0
±- @ionic-native/local-notifications@5.10.0
±- @ionic-native/location-accuracy@5.23.0
±- @ionic-native/network@5.7.0
±- @ionic-native/open-native-settings@5.23.0
±- @ionic-native/screen-orientation@5.12.0
±- @ionic-native/splash-screen@5.5.1
±- @ionic-native/sqlite@5.24.0
±- @ionic-native/status-bar@5.11.0
±- @ionic/angular@4.11.10
±- @ionic/angular-toolkit@1.5.1
±- @ionic/storage@2.2.0
±- @mauron85/cordova-plugin-background-geolocation@3.0.7
±- @ngrx/effects@8.0.1
±- @ngrx/entity@8.0.1
±- @ngrx/store@8.0.1
±- @ngrx/store-devtools@8.0.1
±- @types/jasmine@2.8.16
±- @types/jasminewd2@2.0.6
±- @types/node@10.14.6
±- angular2-signaturepad@2.9.0
±- base64-blob@1.4.1
±- call-number@1.0.1
±- codelyzer@4.5.0
±- com-badrit-base64@0.2.0
±- cordova@9.0.0
±- cordova-android@8.1.0
±- cordova-android-support-gradle-release@3.0.1
±- cordova-browser@6.0.0
±- cordova-ios@5.1.1
±- cordova-open-native-settings@1.5.2
±- cordova-plugin-add-swift-support@2.0.2
±- cordova-plugin-advanced-http@2.1.1
±- cordova-plugin-background-fetch@5.5.0
±- cordova-plugin-background-service@1.3.5
±- cordova-plugin-badge@0.8.8
±- cordova-plugin-camera@4.1.0
±- cordova-plugin-chooser@1.2.5
±- cordova-plugin-crop@0.4.0
±- cordova-plugin-datepicker@0.9.3
±- cordova-plugin-device@2.0.2
±- cordova-plugin-document-viewer@0.9.10
±- cordova-plugin-external-storage@1.0.0 (git+https://github.com/springcard/cordova-plugin-external-storage.git#2b010a1b3c7833b6c3a6c90ceb13505926115b68)
±- cordova-plugin-file@6.0.1
±- cordova-plugin-file-opener2@2.2.1
±- cordova-plugin-file-transfer@1.7.1
±- cordova-plugin-filechooser@1.2.0
±- cordova-plugin-filepath@1.5.5
±- cordova-plugin-filepicker@1.1.6
±- cordova-plugin-geolocation@4.0.2
±- cordova-plugin-inappbrowser@3.1.0
±- cordova-plugin-ionic-keyboard@2.1.3
±- cordova-plugin-ionic-webview@4.1.3
±- cordova-plugin-ios-camera-permissions@1.2.0
±- cordova-plugin-local-notification@0.9.0-beta.2
±- cordova-plugin-mauron85-background-geolocation@3.0.1
±- cordova-plugin-network-information@2.0.1
±- cordova-plugin-request-location-accuracy@2.3.0
±- cordova-plugin-screen-orientation@3.0.2
±- cordova-plugin-settings-hook@0.3.1
±- cordova-plugin-splashscreen@5.0.2
±- cordova-plugin-statusbar@2.4.2
±- cordova-plugin-telerik-imagepicker@2.3.3
±- cordova-plugin-websql@0.0.10
±- cordova-plugin-whitelist@1.3.4
±- cordova-sqlite-storage@5.0.0
±- cordova.plugins.diagnostic@5.0.1
±- core-js@2.6.5
±- es6-promise-plugin@4.2.2
±- file-to-array-buffer@1.0.0
±- ionic-native-http-connection-backend@5.0.4
±- jasmine-core@2.99.1
±- jasmine-spec-reporter@4.2.1
±- karma@4.1.0
±- karma-chrome-launcher@2.2.0
±- karma-coverage-istanbul-reporter@2.0.5
±- karma-jasmine@1.1.2
±- karma-jasmine-html-reporter@0.2.2
±- moment@2.24.0
±- mx.ferreyra.callnumber@0.0.2
±- ng2-pdf-viewer@5.2.4
±- ngx-autosize@1.6.3
±- node-version-compare@1.0.2
±- phonegap-plugin-barcodescanner@8.1.0
±- protractor@5.4.2
±- UNMET PEER DEPENDENCY react-native@>=0.28.0
±- react-native-background-fetch@2.6.0
±- UNMET PEER DEPENDENCY rxjs@6.5.1
±- sentry-cordova@0.17.0
±- signature_pad@3.0.0-beta.3
±- ts-node@8.1.0
±- tslib@1.9.3
±- tslint@5.16.0
±- typescript@3.1.6
`-- zone.js@0.8.29

1 post - 1 participant

Read full topic

I have created a new Stencil project using ionic-pwa. Everything works well in testing.
The problem comes when hosting the www folder on my service provider. My domain does not have a SSL certificate (Required for PWA)

1. Which folders and files do I delete to disable the Servie workers & PWA?
2. Do I use npm init stencil : app then add Ionic to the project, if so how?

1 post - 1 participant

Read full topic

I need help creating a login screen using firebase and a login and registration screen.
who can help me I thank you very much

1 post - 1 participant

Read full topic

Hi,

I’m writing test cases for react ionic app ( using tab template ). I want to test when I click on IonTabButton it should redirect to the correct route. How can I achieve this? Below is the code I’m trying

test("redirect to posts", async () => {

  const history = createMemoryHistory()
  const { baseElement, getByTestId } = render(
    <Router history={history}>
      <App />
    </Router>
  );
  const postBtn = await getByTestId("posts"); // It's not able to find element with posts
  fireEvent.click(postBtn);
  
});

and In IonTabButton

<IonTabButton data-testid="posts" tab="posts" href="/posts">
  <img
     alt="posts"
     className="menu-icon"
     src="/assets/icon/active/category_show.png" /> 
</IonTabButton>

How can I add testid in IonTab Button

And in another test which is on button component (HTML component), in this test case getByTestId is working but click on it causing below error:

TypeError: ionRouterOutlet.commit is not a function

1 post - 1 participant

Read full topic

Hi

Is there any plan to support building .aab-files in AppFlow and send to Play Store?

I would say that it’s “best practice” for Android development and not supporting it is almost an “no go” for us.

1 post - 1 participant

Read full topic

Hi All

I have recently upgrade to capacitor from cordova .

I will be using Appflow as welll.

Prior to commit to Appflow , i believe in need to do a ionic capacitor sync. I am getting the following output with cocopods installing error.

Please advice what must i do? I am using Windows PC

G:\AVR_Project\Ionic Projects\app>ionic capacitor sync
> capacitor.cmd sync
√ Copying web assets from www to android\app\src\main\assets\public in 35.00s
√ Copying native bridge in 67.85ms
√ Copying capacitor.config.json in 2.02ms
/ copy  Found 7 Cordova plugins for android
    cordova-plugin-app-version (0.1.9)
    cordova-plugin-device (2.0.3)
    cordova-plugin-nativegeocoder (3.2.2)
    cordova-plugin-statusbar (2.4.3)
    cordova-plugin-whitelist (1.3.4)
    phonegap-plugin-barcodescanner (8.0.1)
    phonegap-plugin-multidex (1.0.0)
√ copy in 41.30s
√ Updating Android plugins in 35.71ms
  Found 0 Capacitor plugins for android:
  Found 7 Cordova plugins for android
    cordova-plugin-app-version (0.1.9)
    cordova-plugin-device (2.0.3)
    cordova-plugin-nativegeocoder (3.2.2)
    cordova-plugin-statusbar (2.4.3)
    cordova-plugin-whitelist (1.3.4)
    phonegap-plugin-barcodescanner (8.0.1)
    phonegap-plugin-multidex (1.0.0)
\ update android  Found 4 incompatible Cordova plugins for android, skipped install
    cordova-plugin-add-swift-support (2.0.2)
    cordova-plugin-ionic-keyboard (2.2.0)
    cordova-plugin-ionic-webview (4.2.1)
    cordova-plugin-splashscreen (5.0.3)
√ update android in 1.92s
√ Copying web assets from www to ios\App\public in 17.36s
√ Copying native bridge in 93.47ms
√ Copying capacitor.config.json in 32.36ms
\ copy  Found 4 Cordova plugins for ios
    cordova-plugin-app-version (0.1.9)
    cordova-plugin-device (2.0.3)
    cordova-plugin-nativegeocoder (3.2.2)
    phonegap-plugin-barcodescanner (8.0.1)
√ copy in 17.61s
√ Updating iOS plugins in 41.70ms
  Found 0 Capacitor plugins for ios:
  Found 4 Cordova plugins for ios
    cordova-plugin-app-version (0.1.9)
    cordova-plugin-device (2.0.3)
    cordova-plugin-nativegeocoder (3.2.2)
    phonegap-plugin-barcodescanner (8.0.1)
× Updating iOS native dependencies with "pod install" (may take several minutes):
× update ios:
[error] Error running update: 'pod' is not recognized as an internal or external command,
operable program or batch file.

√ copy in 418.71μp
√ update web in 12.27μp
Sync finished in 62.757s

5 posts - 2 participants

Read full topic

I’m scratching my head since last three days, but continuously failing to achieve my desired results, all I want is to fetch the geolocation coordinates, if the device location is turned off, a prompt is show to enable the location without leaving the app, and device location gets turn on I’ve verified it manually.
But the problem is everytime I try, I get fall into the error method

import { LocationAccuracy } from '@ionic-native/location-accuracy/ngx';
import { Plugins } from '@capacitor/core';
const { Geolocation } = Plugins;

this.locationAccuracy.request(this.locationAccuracy.REQUEST_PRIORITY_HIGH_ACCURACY).
then(() => {

      Geolocation.getCurrentPosition({ enableHighAccuracy: true }).then(loc => {

        alert('Position detected successfully' + loc);

      }).catch(error => {

        alert(error);

      });

    }).catch(deny => {

      alert('You denied the location');

    });

But there is something very strange, and that is just before launching the app, If I run google maps and locate my self, then my app works without any issue, otherwise it keep falling into error method.
Any help will be highly appreciated .

1 post - 1 participant

Read full topic

Hi

Many ionic components (modal, loading, popover etc) are based on the overlay. According to the doc, one way to pass in data is via the ComponentProps property. This only works for the first time, but if I update ComponentProps, the overlay component will not update and there is no way for me to force update.

Take popover for example, once present method has been called, it seems the HTML element has been created with the initial value of ComponentProps. My question is if I update ComponentProps, how do I get popover to reflect my latest value in ComponentProps? https://github.com/ionic-team/ionic/blob/5f2001c43c0846ec8973cbb8eb5662976ba7e31a/core/src/components/popover/popover.tsx#L138

Btw, I am using Ionic Angular, I only see ngOnInit lifecycle event called in popover component, I don’t see ngOnChanges event fired at all.

Thanks!

1 post - 1 participant

Read full topic

Hi I just searched for over one day and couldnt find out how to change the android system navigation bar on the bottom of the app to a custom color? Is that even possible.

On Ionic 3 there was this plugin for it:

1 post - 1 participant

Read full topic

My Ionic application using Angular is throwing this error in console as “maximum call stack size exceeded” at application startup. This is negatively affecting application startup times

ERROR RangeError: Maximum call stack size exceeded
    at CatchSubscriber.push../node_modules/rxjs/_esm5/internal/operators/catchError.js.CatchSubscriber.error (catchError.js:30)
    at MergeMapSubscriber.push../node_modules/rxjs/_esm5/internal/OuterSubscriber.js.OuterSubscriber.notifyError (OuterSubscriber.js:13)
    at InnerSubscriber.push../node_modules/rxjs/_esm5/internal/InnerSubscriber.js.InnerSubscriber._error (InnerSubscriber.js:18)
    at InnerSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.error (Subscriber.js:59)
    at MapSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber._error (Subscriber.js:79)
    at MapSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.error (Subscriber.js:59)
    at MergeMapSubscriber.push../node_modules/rxjs/_esm5/internal/OuterSubscriber.js.OuterSubscriber.notifyError (OuterSubscriber.js:13)
    at InnerSubscriber.push../node_modules/rxjs/_esm5/internal/InnerSubscriber.js.InnerSubscriber._error (InnerSubscriber.js:18)
    at InnerSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.error (Subscriber.js:59)
    at CatchSubscriber.push../node_modules/rxjs/_esm5/internal/OuterSubscriber.js.OuterSubscriber.notifyError (OuterSubscriber.js:13)

1 post - 1 participant

Read full topic

Hey folks.

Been going around in circles for hours now, so ending up here.
im trying to implement facebook login (native from ionic). ive followed the guides (about 4 at this point, but all the same), and everything looks good!

then i run
ionic build
npx cap add ios

• at this point the console gives me some warning
  eg .
  "[warn] Plugin cordova-plugin-facebook4 might require you to add

<dict>
      <key>CFBundleURLSchemes</key>
      <array>
        <string>fb$APP_ID</string>
      </array>
    </dict>

in the existing CFBundleURLTypes entry of your Info.plist to work"

i firstly ignored them, and when i ran npx cap open ios, the app runs, but i get ‘no facebook ID sent’.

so i went back to the console, and started inserting the code from above (warnings). then when i run npx cap open ios, the build fails in xcode with
"error: unable to read property list from file: etc etc’.

so firstly, do i take the console as truth, and add the parts recommended?
if so, when it says <string>fb$APP_ID</string>, do i insert that, or <string>fb121212</string>
?

i must be missing something step, but at this point im clueless, as i have seen nobody have this problem in any tutorial/video!

thanks

2 posts - 1 participant

Read full topic

I got an error 404 from trying to install the inappbrowser plugin

npm install @ionic-enterprise/inappbrowser

npm ERR! code E404
npm ERR! 404 Not Found - GET https://registry.npmjs.org/@ionic-enterprise%2finappbrowser - Not found
npm ERR! 404
npm ERR! 404  '@ionic-enterprise/inappbrowser@latest' is not in the npm registry.
'''

I have also run npm config set registry https://registry.npmjs.org/ but still get the same error

1 post - 1 participant

Read full topic

import { Injectable } from ‘@angular/core’;
import { TranslateLoader } from ‘@ngx-translate/core’;
import { APIURL } from “…/enum”
import { Observable } from ‘rxjs’;
import {HttpClient, HttpErrorResponse, HttpHeaders,HttpParams} from ‘@angular/common/http’;

@Injectable()
export class CustomTranslateLoader implements TranslateLoader {
contentHeader = new Headers({“Content-Type”: “application/json”,“Access-Control-Allow-Origin”:"*"});

constructor(private http: HttpClient) {}
getTranslation(lang: string): Observable<any>{

            const options = {
   headers: new HttpHeaders({ 'Content-Type':'application/json; charset=utf-8',"Access-Control-Allow-Origin":"*"}),
    params: new HttpParams(),
    reportProgress: false,

};

    var apiAddress = APIURL.LIVE+"static/i18n/"+ lang+".json";
    return Observable.create(observer => {
      this.http.get(apiAddress,options).subscribe((res: Response) => {
                observer.next(res.json());
                observer.complete();               
            },
        error => {
            //  failed to retrieve from api, switch to local
            this.http.get("/assets/i18n/en.json").subscribe((res: Response) => {
                observer.next(res.json());
                observer.complete();               
            })
        }
        );
    }); 
}

}

I am using above code…but external link getting failed to fetch data.if i open link with browser working fine please help me.

Screenshot (6)1366×768 128 KB

1 post - 1 participant

Read full topic