Quantcast
Channel: Ionic Forum - Latest topics
Viewing all 70424 articles
Browse latest View live

adMob pro error on ios

$
0
0

Hello!

I am trying to implement ads through admob-plus and when I try to open the ads in a browser through manual button presses it seems to run fine albeit without an actual ad showing up. However, when I run the app on an ios emulator or physical device, I get a long error code in xcode and no ad for all types of ads.

I think this is an ionic specific issue because there is little documentation on this error outside of ionic but I could be wrong. I also think I might need to implement it into app.module but I do not know how to do that.

Error:

[error] - ERROR {"rejection":{"code":"UNIMPLEMENTED"},"promise":{"__zone_symbol__state":0,"__zone_symbol__value":"..."},"zone":{"_parent":{"_parent":null,"_name":"<root>","_properties":{},"_zoneDelegate":{"_taskCounts":{"microTask":0,"macroTask":0,"eventTask":0},"zone":"...","_parentDelegate":null,"_forkZS":null,"_forkDlgt":null,"_forkCurrZone":null,"_interceptZS":null,"_interceptDlgt":null,"_interceptCurrZone":null,"_invokeZS":null,"_invokeDlgt":null,"_invokeCurrZone":null,"_handleErrorZS":null,"_handleErrorDlgt":null,"_handleErrorCurrZone":null,"_scheduleTaskZS":null,"_scheduleTaskDlgt":null,"_scheduleTaskCurrZone":null,"_invokeTaskZS":null,"_invokeTaskDlgt":null,"_invokeTaskCurrZone":null,"_cancelTaskZS":null,"_cancelTaskDlgt":null,"_cancelTaskCurrZone":null,"_hasTaskZS":null,"_hasTaskDlgt":null,"_hasTaskDlgtOwner":null,"_hasTaskCurrZone":null}},"_name":"angular","_properties":{"isAngularZone":true},"_zoneDelegate":{"_taskCounts":{"microTask":0,"macroTask":0,"eventTask":33},"zone":"...","_parentDelegate":"...","_forkZS":null,"_forkDlgt":null,"_forkCurrZone":null,"_interceptZS":null,"_interceptDlgt":null,"_interceptCurrZone":null,"_invokeZS":{"name":"angular","properties":"..."},"_invokeDlgt":"...","_invokeCurrZone":"...","_handleErrorZS":"...","_handleErrorDlgt":"...","_handleErrorCurrZone":"...","_scheduleTaskZS":{"name":""},"_scheduleTaskDlgt":"...","_scheduleTaskCurrZone":"...","_invokeTaskZS":"...","_invokeTaskDlgt":"...","_invokeTaskCurrZone":"...","_cancelTaskZS":"...","_cancelTaskDlgt":"...","_cancelTaskCurrZone":"...","_hasTaskZS":"...","_hasTaskDlgt":"...","_hasTaskDlgtOwner":"...","_hasTaskCurrZone":"..."}},"task":{"type":"microTask","state":"notScheduled","source":"Promise.then","zone":"angular","runCount":0}}

in home.page.ts:

import { AdMobPlus, BannerAd, InterstitialAd, RewardedAd} from '@admob-plus/capacitor';

export class HomePage implements OnInit {
constructor(
private alertCtrl: AlertController,
private modalCtrl: ModalController,
private menu: MenuController,
) {}

banner() {
  const banner = new BannerAd({
    adUnitId: 'ca-app-pub-3940256099942544/2934735716',
    position: 'bottom',
  })
  banner.load()
  banner.show()

  AdMobPlus.addListener('banner.impression', async () => {
  banner.hide()
  })

}

interstitial() {
  const interstitial = new InterstitialAd({
    adUnitId: 'ca-app-pub-3940256099942544/4411468910',
  })
  interstitial.load()
  interstitial.show()
}

reward() {
  const rewarded = new RewardedAd({
    adUnitId: 'ca-app-pub-3940256099942544/1712485313',
  })
  rewarded.load()
  rewarded.show()
}
}

app.module.ts:

import { NgModule } from '@angular/core';
import { IonicStorageModule } from '@ionic/Storage';
import { BrowserModule } from '@angular/platform-browser';
import { RouteReuseStrategy } from '@angular/router';
import { IonicModule, IonicRouteStrategy } from '@ionic/angular';
import { SplashScreen } from '@ionic-native/splash-screen/ngx';
import { StatusBar } from '@ionic-native/status-bar/ngx';
import { HomePageModule } from './home/home.module';

import { AppComponent } from './app.component';
import { AppRoutingModule } from './app-routing.module';



@NgModule({
  declarations: [AppComponent],
  entryComponents: [],
  imports: [BrowserModule, 
  IonicModule.forRoot(), 
  AppRoutingModule, 
  IonicStorageModule.forRoot({
      name: '__mydb',
         driverOrder: ['sqlite', 'websql',  'localstorage']
    })
  ],
  providers: [
    StatusBar,
    SplashScreen,
    Storage,
    { provide: RouteReuseStrategy, useClass: IonicRouteStrategy}
  ],
  bootstrap: [AppComponent]
})
export class AppModule {}

ios/App/App/Info.plist:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
	<key>CFBundleDevelopmentRegion</key>
	<string>en</string>
	<key>CFBundleDisplayName</key>
	<string>CoasterBuddy</string>
	<key>CFBundleExecutable</key>
	<string>$(EXECUTABLE_NAME)</string>
	<key>CFBundleIdentifier</key>
	<string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>
	<key>CFBundleInfoDictionaryVersion</key>
	<string>6.0</string>
	<key>CFBundleName</key>
	<string>$(PRODUCT_NAME)</string>
	<key>CFBundlePackageType</key>
	<string>APPL</string>
	<key>CFBundleShortVersionString</key>
	<string>1.0</string>
	<key>CFBundleVersion</key>
	<string>1</string>
	<key>LSRequiresIPhoneOS</key>
	<true/>
	<key>NSAppTransportSecurity</key>
	<dict>
		<key>NSAllowsArbitraryLoads</key>
		<true/>
	</dict>
	<key>UILaunchStoryboardName</key>
	<string>LaunchScreen</string>
	<key>UIMainStoryboardFile</key>
	<string>Main</string>
	<key>UIRequiredDeviceCapabilities</key>
	<array>
		<string>armv7</string>
	</array>
	<key>UISupportedInterfaceOrientations</key>
	<array>
		<string>UIInterfaceOrientationPortrait</string>
		<string>UIInterfaceOrientationLandscapeLeft</string>
		<string>UIInterfaceOrientationLandscapeRight</string>
	</array>
	<key>UISupportedInterfaceOrientations~ipad</key>
	<array>
		<string>UIInterfaceOrientationPortrait</string>
		<string>UIInterfaceOrientationPortraitUpsideDown</string>
		<string>UIInterfaceOrientationLandscapeLeft</string>
		<string>UIInterfaceOrientationLandscapeRight</string>
	</array>
	<key>UIViewControllerBasedStatusBarAppearance</key>
	<true/>
	<key>NSLocationWhenInUseUsageDescription</key>
	<string>Find parks nearby</string>
	<key>GADApplicationIdentifier</key>
    <string>ca-app-pub-8387175987712880~4680457054</string>
    <key>SKAdNetworkItems</key>
    <array>
        <dict>
            <key>SKAdNetworkIdentifier</key>
            <string>cstr6suwn9.skadnetwork</string>
        </dict>
        <dict>
            <key>SKAdNetworkIdentifier</key>
            <string>4fzdc2evr5.skadnetwork</string>
        </dict>
        <dict>
            <key>SKAdNetworkIdentifier</key>
            <string>2fnua5tdw4.skadnetwork</string>
        </dict>
        <dict>
            <key>SKAdNetworkIdentifier</key>
            <string>ydx93a7ass.skadnetwork</string>
        </dict>
        <dict>
            <key>SKAdNetworkIdentifier</key>
            <string>5a6flpkh64.skadnetwork</string>
        </dict>
        <dict>
            <key>SKAdNetworkIdentifier</key>
            <string>p78axxw29g.skadnetwork</string>
        </dict>
        <dict>
            <key>SKAdNetworkIdentifier</key>
            <string>v72qych5uu.skadnetwork</string>
        </dict>
        <dict>
            <key>SKAdNetworkIdentifier</key>
            <string>c6k4g5qg8m.skadnetwork</string>
        </dict>
        <dict>
            <key>SKAdNetworkIdentifier</key>
            <string>s39g8k73mm.skadnetwork</string>
        </dict>
        <dict>
            <key>SKAdNetworkIdentifier</key>
            <string>3qy4746246.skadnetwork</string>
        </dict>
        <dict>
            <key>SKAdNetworkIdentifier</key>
            <string>3sh42y64q3.skadnetwork</string>
        </dict>
        <dict>
            <key>SKAdNetworkIdentifier</key>
            <string>f38h382jlk.skadnetwork</string>
        </dict>
        <dict>
            <key>SKAdNetworkIdentifier</key>
            <string>hs6bdukanm.skadnetwork</string>
        </dict>
        <dict>
            <key>SKAdNetworkIdentifier</key>
            <string>prcb7njmu6.skadnetwork</string>
        </dict>
        <dict>
            <key>SKAdNetworkIdentifier</key>
            <string>v4nxqhlyqp.skadnetwork</string>
        </dict>
        <dict>
            <key>SKAdNetworkIdentifier</key>
            <string>wzmmz9fp6w.skadnetwork</string>
        </dict>
        <dict>
            <key>SKAdNetworkIdentifier</key>
            <string>yclnxrl5pm.skadnetwork</string>
        </dict>
        <dict>
            <key>SKAdNetworkIdentifier</key>
            <string>t38b2kh725.skadnetwork</string>
        </dict>
        <dict>
            <key>SKAdNetworkIdentifier</key>
            <string>7ug5zh24hu.skadnetwork</string>
        </dict>
        <dict>
            <key>SKAdNetworkIdentifier</key>
            <string>9rd848q2bz.skadnetwork</string>
        </dict>
        <dict>
            <key>SKAdNetworkIdentifier</key>
            <string>n6fk4nfna4.skadnetwork</string>
        </dict>
        <dict>
            <key>SKAdNetworkIdentifier</key>
            <string>kbd757ywx3.skadnetwork</string>
        </dict>
        <dict>
            <key>SKAdNetworkIdentifier</key>
            <string>9t245vhmpl.skadnetwork</string>
        </dict>
        <dict>
            <key>SKAdNetworkIdentifier</key>
            <string>4468km3ulz.skadnetwork</string>
        </dict>
        <dict>
            <key>SKAdNetworkIdentifier</key>
            <string>2u9pt9hc89.skadnetwork</string>
        </dict>
        <dict>
            <key>SKAdNetworkIdentifier</key>
            <string>8s468mfl3y.skadnetwork</string>
        </dict>
        <dict>
            <key>SKAdNetworkIdentifier</key>
            <string>av6w8kgt66.skadnetwork</string>
        </dict>
        <dict>
            <key>SKAdNetworkIdentifier</key>
            <string>klf5c3l5u5.skadnetwork</string>
        </dict>
        <dict>
            <key>SKAdNetworkIdentifier</key>
            <string>ppxm28t8ap.skadnetwork</string>
        </dict>
        <dict>
            <key>SKAdNetworkIdentifier</key>
            <string>424m5254lk.skadnetwork</string>
        </dict>
        <dict>
            <key>SKAdNetworkIdentifier</key>
            <string>uw77j35x4d.skadnetwork</string>
        </dict>
        <dict>
            <key>SKAdNetworkIdentifier</key>
            <string>578prtvx9j.skadnetwork</string>
        </dict>
        <dict>
            <key>SKAdNetworkIdentifier</key>
            <string>4dzt52r2t5.skadnetwork</string>
        </dict>
        <dict>
            <key>SKAdNetworkIdentifier</key>
            <string>e5fvkxwrpn.skadnetwork</string>
        </dict>
        <dict>
            <key>SKAdNetworkIdentifier</key>
            <string>8c4e2ghe7u.skadnetwork</string>
        </dict>
        <dict>
            <key>SKAdNetworkIdentifier</key>
            <string>zq492l623r.skadnetwork</string>
        </dict>
        <dict>
            <key>SKAdNetworkIdentifier</key>
            <string>3qcr597p9d.skadnetwork</string>
        </dict>
    </array>

    <key>GADIsAdManagerApp</key>
<true/>
<key>GADApplicationIdentifier</key>
<string>ca-app-pub-3940256099942544~3347511713</string>
<key>SKAdNetworkItems</key>
<array>
  <dict>
    <key>SKAdNetworkIdentifier</key>
    <string>cstr6suwn9.skadnetwork</string>
  </dict>
</array>
<key>NSUserTrackingUsageDescription</key>
<string>[Why you use NSUserTracking. ex: This identifier will be used to deliver personalized ads to you.]</string>
    
</dict>
</plist>

I am pretty lost so I would appreciate any suggestions. I hope this is enough information. Thanks in advance!

1 post - 1 participant

Read full topic


Android 11 no display data

$
0
0

Good,

I’m using a phone with android 11, I consume an api but the data always comes out blank, but if I use an ionic serve to upload my project to the navigation it brings me all the information, I’ve been looking on the internet for some information that can help me help but I couldn’t find anything to help me solve this problem

If I use another device with android 9 below, my application shows the data without problems.
this._GetServicesService.ejecutarQuery<Compania>(’/compania’).subscribe(
data =>{
this.Compania = data
console.log( this.Compania);
}
)
Ionic:

Ionic CLI : 6.18.1

Utility:

cordova-res : 0.15.4
native-run : 1.5.0

System:

NodeJS : v16.14.0
npm : 8.5.0
OS : Windows 10

1 post - 1 participant

Read full topic

How to prevent split-pane create new pages when I swithc between pages

$
0
0

I use Ionic 5 + Vue 3’s composition API.

This is very annoying because my APP requires running something in the background. I could not put everything inside app.vue…

This animation shows on that page if I did something, such as opening a file, selecting another page then coming back, everything on the pages is lost. A new page was created.

ionic issue

Same story for all the pages in my app.

I am not sure this is expected because there is no reason for it.
Ionic said in its document that I should not use VUE’s keep pages API.

I also notice, the Ionic didn’t close the previous pages but created a new one.
Because if I init a setInterval to print something in the console for 10 seconds, after switching out and back a few times, it will print much quicker.

Here are the code for the router, not sure if it is related.

import { createRouter, createWebHistory } from '@ionic/vue-router';
import { RouteRecordRaw } from 'vue-router';

const routes: Array<RouteRecordRaw> = [
  {
    path: '',
    redirect: '/pages/summary'
  },
  {
    path: '/pages/summary',
    component: () => import ('../summary/summary-view.vue')
  },
  {
    path: '/pages/parameters',
    component: () => import ('../msgparser/param-view.vue')
  },
  {
    path: '/pages/waypoint',
    component: () => import ('../map/map-view.vue')
  },
  {
    path: '/pages/control',
    component: () => import ('../control/control-view.vue')
  },
  {
    path: '/pages/file',
    component: () => import ('../file/file-view.vue')
  },
]

Thanks.

1 post - 1 participant

Read full topic

How to solve Ionic error "Error acquiring assertion"

$
0
0

I’m stack on ios deployment for the ionic project. On the project, we have used for video. if I deployed android build not any issue was found but if I build the ios build and run in emulator then the video did not play and I got error “assertion] Error acquiring assertion: <NSError: 0x600001586a00; domain: RBSAssertionErrorDomain; code: 2; reason: “Required client entitlement is missing”>” on Xcode console.

Below mentioned full console response

2022-02-14 11:53:16.338444+0530 American Classes[43395:351318] Apache Cordova native platform version 4.5.5 is starting.
2022-02-14 11:53:16.338588+0530 American Classes[43395:351318] Multi-tasking → Device: YES, App: YES
2022-02-14 11:53:16.368872+0530 American Classes[43395:351318] CDVWKWebViewEngine: trying to inject XHR polyfill
2022-02-14 11:53:16.599649+0530 American Classes[43395:351318] CDVWKWebViewEngine will reload WKWebView if required on resume
2022-02-14 11:53:16.599885+0530 American Classes[43395:351318] Using Ionic WKWebView
2022-02-14 11:53:16.600189+0530 American Classes[43395:351318] [CDVTimer][console] 0.046968ms
2022-02-14 11:53:16.600361+0530 American Classes[43395:351318] [CDVTimer][handleopenurl] 0.064969ms
2022-02-14 11:53:16.601862+0530 American Classes[43395:351318] Unlimited access to network resources
2022-02-14 11:53:16.602018+0530 American Classes[43395:351318] [CDVTimer][intentandnavigationfilter] 1.571059ms
2022-02-14 11:53:16.602167+0530 American Classes[43395:351318] [CDVTimer][gesturehandler] 0.056982ms
2022-02-14 11:53:16.602371+0530 American Classes[43395:351318] CDVIonicKeyboard: resize mode 1
2022-02-14 11:53:16.602959+0530 American Classes[43395:351318] [CDVTimer][cdvionickeyboard] 0.687957ms
2022-02-14 11:53:16.608063+0530 American Classes[43395:351318] [CDVTimer][splashscreen] 4.987955ms
2022-02-14 11:53:16.609402+0530 American Classes[43395:351318] [CDVTimer][statusbar] 1.162052ms
2022-02-14 11:53:16.609517+0530 American Classes[43395:351318] [CDVTimer][TotalPluginStartup] 9.400964ms
2022-02-14 11:53:20.972123+0530 American Classes[43395:351318] Ionic Native: deviceready event fired after 1797 ms
2022-02-14 11:53:33.370209+0530 American Classes[43395:351318] [IPC] Connection::waitForSyncReply: Timed-out while waiting for reply, id = 7
2022-02-14 11:53:46.404165+0530 American Classes[43395:354469] [assertion] Error acquiring assertion: <NSError: 0x600001586a00; domain: RBSAssertionErrorDomain; code: 2; reason: “Required client entitlement is missing”> {
userInfo = {
RBSAssertionAttribute = <RBSLegacyAttribute: 0x7f83f2435a50; requestedReason: MediaPlayback; reason: MediaPlayback; flags: PreventTaskSuspend | PreventTaskThrottleDown | WantsForegroundResourcePriority>;
}
}
2022-02-14 11:53:46.404321+0530 American Classes[43395:354469] [ProcessSuspension] 0x10e3de5f0 - ProcessAssertion() PID 43395 Unable to acquire assertion for process with PID 43395
2022-02-14 11:53:46.405126+0530 American Classes[43395:351318] [ProcessSuspension] 0x10e3de5f0 - ProcessAssertion::processAssertionWasInvalidated()
2022-02-14 11:53:46.408109+0530 American Classes[43395:354469] [assertion] Error acquiring assertion: <NSError: 0x6000015968b0; domain: RBSAssertionErrorDomain; code: 2; reason: “Required client entitlement is missing”> {
userInfo = {
RBSAssertionAttribute = <RBSLegacyAttribute: 0x7f83f242cf10; requestedReason: MediaPlayback; reason: MediaPlayback; flags: PreventTaskSuspend | PreventTaskThrottleDown | WantsForegroundResourcePriority>;
}
}
2022-02-14 11:53:46.410572+0530 American Classes[43395:354469] [ProcessSuspension] 0x10e3de640 - ProcessAssertion() PID 43395 Unable to acquire assertion for process with PID 43410
2022-02-14 11:53:46.412241+0530 American Classes[43395:351318] [ProcessSuspension] 0x10e3de640 - ProcessAssertion::processAssertionWasInvalidated()
2022-02-14 11:53:46.988429+0530 American Classes[43395:354479] [plugin] AddInstanceForFactory: No factory registered for id <CFUUID 0x600001b68cc0> F8BB1C28-BAE8-11D6-9C31-00039315CD46

Sorry for my English and Advance thanks for your help…

1 post - 1 participant

Read full topic

Ionic forum bug, cannot change email address so that i can log in with another email address

$
0
0

Hello,

I can sign out, but when i click Log in it logs me back in on the same email. I can not see any other option while this is not the account I want to log in with.

Please help, how can i see the email and password log in form again when i click the log in button.

check out this video

1 post - 1 participant

Read full topic

Change the style of active ion-segment-button change slide in vue js

$
0
0

is there any way to design active ion-segment-button ?

        <ion-toolbar>

          <ion-segment :value="tabs" @ionChange="segmentChanged($event)" scrollable>

            <ion-segment-button value="0">

              <font-awesome-icon :icon="['fas', 'file-invoice-dollar']" class="icon_segement" />  

              <ion-label class="label_segement" text-wrap>Historique<br>des loyers</ion-label>

            </ion-segment-button>

            <ion-segment-button value="1">

              <ion-icon :icon="hammer" class="icon_segement" />  

              <ion-label class="label_segement" text-wrap>Historique <br>  des réparations</ion-label>

            </ion-segment-button>

            <ion-segment-button value="2">

              <font-awesome-icon :icon="['fas', 'file-invoice']" class="icon_segement" />

              <ion-label class="label_segement" text-wrap>Historique <br> des factures</ion-label>

            </ion-segment-button>

            <ion-segment-button value="3">

              <font-awesome-icon :icon="['fas', 'house-damage']" class="icon_segement" />  

              <ion-label class="label_segement" text-wrap>Cautionnement</ion-label>

            </ion-segment-button>

          </ion-segment>

        </ion-toolbar>

Sans titre

1 post - 1 participant

Read full topic

Friends management API service

$
0
0

Hope this is the right section for my matter, did not find a better one.

I am searching for a provider/ backend service that offers sth like a Friends-List-API.
So a ready to use API that has standard functionalities of friends or contacts-list, like adding friends, handling friendship invitations, returning full friends list, and so on …
My goal is to use it for my Ionic mobile app.
I guess something like that should be available out of the box since its needed almost everywhere. However, I simply cannot find anything appropriate online.

If also other functionalities are included in this services, thats fine.

Any suggestion ? Thanks a lot!

1 post - 1 participant

Read full topic

Push notification plugin is not working android in Capacitor v2

$
0
0

Hello, everyone.
I am building an ionic project using capacitor.

I am working on an ionic capacitor v2 project. I am able to implement push notifications via firebase cloud messaging. is working as well in the ios version. but when calling Push notification.register() in the android version, the app crashed. I didn’t find the solution for this. Please help me.

I also try to use @capacitor-community/fcm. but this is not working too.

Please help me

Thanks.
Silas.

3 posts - 2 participants

Read full topic


Horizontal slide for react

$
0
0

Hi there,

Does anyone has a working implementation for horizontal sliding using React? There a tons of working examples for Angular but can’t find any for React. Here’s an example of what I’m trying to accomplish:

And here’s a code snippet for the Angular version that I’m trying to implement for React:

<ion-slides pager="true" [options]="slideOpts">
    <ion-slide *ngFor="let item of items">
        <h1>some slide</h1>
    </ion-slide>
</ion-slides>

Couldn’t find a way to implement ngFor in React.

Thanks!

1 post - 1 participant

Read full topic

Display calendar of months in ionic vuejs

$
0
0

i want to display calendar of months like the picture below.
any help !?
Sans titre

1 post - 1 participant

Read full topic

Java.exe path is wrong

$
0
0

Hi everyone,

javac -version: javac 17.0.2

I have two Java folders:
1- C: \ Program Files \ Java \ jdk-17.0.2

2- C: \ Program Files (x86) \ Java \ jre1.8.0_321

When I type the command “ionic capacitor run android” I get the following error:
“Supplied javaHome must be a valid directory. You supplied: C: \ Program Files (x86) \ Java \ jre1.8.0_311”

the jre1.8.0_311 folder doesn’t even exist.

In cmd if I type:
% JAVA_HOME% → C: \ Program Files (x86) \ Java \ jre1.8.0_321

In the PATH variable I added% JAVA_HOME% \ bin

1 post - 1 participant

Read full topic

Framework delegate missing when using modalController.create in React

$
0
0

Hello everyone.

I’ve been using the useIonModal hook everywhere in my app, and it works fine, but now I wanted to make my own modal hook, in order to know when the modal is displayed and when it is closed (onDidDismiss) outside of it.

useModal.tsx:

import {createContext, useContext} from "react";
import {ComponentRef, modalController} from "@ionic/core";

type ModalContextModel = (
    component: ComponentRef,
    props: any,
    fullscreen?: boolean
) => Promise<HTMLIonModalElement>;

export const ModalContext = createContext({} as ModalContextModel);

export const ModalProvider = ({children}: any) => {
    async function createModal(
        component: ComponentRef,
        props: any,
        fullscreen: boolean = true
    ): Promise<HTMLIonModalElement> {
        const modal = await modalController.create({
            component,
            componentProps: props,
            cssClass: fullscreen ? 'full-screen-modal' : '',
        });

        await modal.present();

        return modal;
    }

    return (
        <ModalContext.Provider value={createModal}>
            {children}
        </ModalContext.Provider>
    );
};


const useModal = () => {
    return useContext(ModalContext);
};

export default useModal;

Another component:

const createModal = useModal();
// ......
// ......
const modal = await createModal(
            SomeComponent,
            someProps
        );

The error message:

Uncaught (in promise) Error: framework delegate is missing
    at attachComponent (framework-delegate.js:11:1)
    at Modal.present (ion-modal.js:812:1)
    at createModal (useModal.tsx:24:1)
    at async updateField (AnotherComponent.tsx:88:1)

I looked everywhere but could only find Angular examples on how this works.

Thanks for all the help!

1 post - 1 participant

Read full topic

Deep linking issue

Issue with rounding corners in ion item Safari only

$
0
0

I am trying to have round corners in my ion items across my app, when i serve in chrome to debug it shows rounded with no problems but when i try in safari or my Iphone, all the corners go back to square. I have tried -webkit-border-radius , -webkit-appearance and --border-radius but nothing changes
Any help it is appreciate it

1 post - 1 participant

Read full topic

IonPopover trigger not working

$
0
0

Hello. Im getting this error when trying to use IonPopover:

JSX attribute) trigger: string
The type ‘{ children: Element; trigger:string; side:string; }’ cannot be assigned to type ‘IntrinsicAttributes & Pick<PopoverOptions, “id” | “cssClass” | “animate” | “mode” | “backdropDismiss” | … 6 more … | “event”> & { …; } & ReactOverlayProps & { …; } & RefAttributes<…>’.
Property ‘trigger’ does not exist on type ‘IntrinsicAttributes & Pick<PopoverOptions, “id” | “cssClass” | “animate” | “mode” | “backdropDismiss” | … 6 more … | “event”> & { …; } & ReactOverlayProps & { …; } & RefAttributes<…>’.ts(2322)

This is the code:

return (

      <IonPage >

        <IonHeader>

          <IonToolbar>

            <IonGrid>

              <IonRow id="header">

                <IonCol id="columna" size="1.5"><IonButtons ><IonMenuButton /> </IonButtons></IonCol>

                <IonCol id="columna2" ><Busqueda categorias={categorias} setCategorias={setCategorias} setProveedorBuscadoHook={setProveedorBuscadoHook} setBuscar={setBuscar} /></IonCol>

                <IonCol id="columna3" size="1.5">

                  <Card notify={notifications}></Card>

                </IonCol>

                <IonPopover trigger="columna3" side="top">

                  <IonContent>Popover Content</IonContent>

                </IonPopover>

                <IonCol id="columna3" size="1.5">

                    <img src={props.foto} id="foto-usuario" onClick={() => {  setShowModal({ isOpen: true});  setTipoDeVistaEnModal("datosUsuario")}}/>

                 </IonCol>

              </IonRow>

            </IonGrid>

          </IonToolbar>

        </IonHeader>

        <IonContent >
          <div id="ionContentHome">
         //Some Code
          </div>
        </IonContent>
      </IonPage>

  );

1 post - 1 participant

Read full topic


No device target ID with capacitor run ios --list

$
0
0

Hi,

I want to run my ionic app with capacitor on my phsiscal device, an iPhone 13 mini. But I can not detect the target id.

With ionic cap run ios --list I got a “?”:

❯ ionic cap run ios --list
Name                                              | API        | Target ID

-----------------------------------------------------------------------------------------------------
SB 13 mini                                        | iOS 15.2.1 | ?
iPad (9th generation) (simulator)                 | iOS 15.2   | CB7E86E9-4DC4-4B2A-B57F-B13FE2191075

My workaround is to use “–open” and then build with xcode UI directly. This works. Only via CLI Is not possible.

Ionic info:

Ionic:

   Ionic CLI                     : 6.18.1 (/Users/sbj/.nvm/versions/node/v14.15.1/lib/node_modules/@ionic/cli)
   Ionic Framework               : @ionic/angular 6.0.5
   @angular-devkit/build-angular : 13.0.4
   @angular-devkit/schematics    : 13.0.4
   @angular/cli                  : 13.0.4
   @ionic/angular-toolkit        : 5.0.3

Capacitor:

   Capacitor CLI      : 3.4.0
   @capacitor/android : not installed
   @capacitor/core    : 3.4.0
   @capacitor/ios     : 3.4.1

Utility:

   cordova-res (update available: 0.15.4) : 0.15.3
   native-run                             : 1.5.0

System:

   NodeJS : v16.13.2 (/Users/sbj/.nvm/versions/node/v16.13.2/bin/node)
   npm    : 8.1.2
   OS     : macOS Monterey

1 post - 1 participant

Read full topic

Navigator.credentials is undefined

$
0
0

I want to implement Webauthn in my capacitor ionic vue app.

It should be supported and it navigator.credentials is available everywhere (desktop safari, mobile Safari even when I use the native browser from capacitor using @capacitor/browser to open a page I can see that navigator.credentials is available.

But it stays undefined when accessing it directly from my application.

I have tried:

  • Changing the capacitor.config.ts file to use a localhost as hostname (since this is recommended for navigator.geolocation by capacitor)
  • Changing the capacitor.config.ts to use a different UserAgent by using overrideUserAgent to excacyl match that of my safari browser on ios

I don’t know what else to try.

also not only navigator.credentials is missing but also navigator.serviceWorker and navigator.mediaDevices (but fixes for these two did not fix my issue)

1 post - 1 participant

Read full topic

Create slides dynamically

$
0
0

Hi everyone, I have a problem.
I have a blank page and I would like to put one or more slides based on the response from the web service.
I inserted a div in the page with the [innerHTML] attribute

<div [innerHTML]="variableTextHtml"></div>

and into file.ts I call a webservice and I set the variableTextHtml with:

<ion-slides pager='true' autoplay="5000" loop="true" speed="3000">
                <ion-slide>
                  <h1>Slide 1</h1>
                </ion-slide>
etc.. etc..

When i run the app, slide doesn’t work.
How can I dynamically add components to the app’s html page?
Thank you

1 post - 1 participant

Read full topic

Fit the height of ion-content to the content of ion-slide

$
0
0

the height of the content for a slide is not filling the whole content. This means I have a blank space at the bottom of the slide.
how can i fit the height of ion-content to the content of ion-slide?
here’s a code below!

<ion-content>
    <ion-slides pager="true">

      <ion-slide>
          <div><h1>FIRST</h1></div>
          <div><h1>FIRST</h1></div>
          <div><h1>FIRST</h1></div>
          <div><h1>FIRST</h1></div>
          <div><h1>FIRST</h1></div>
          <div><h1>FIRST</h1></div>
          <div><h1>FIRST</h1></div>
          <div><h1>FIRST</h1></div>
          <div><h1>FIRST</h1></div>
          <div><h1>FIRST</h1></div>
          <div><h1>FIRST</h1></div>
          <div><h1>FIRST</h1></div>
          <div><h1>FIRST</h1></div>
          <div><h1>FIRST</h1></div>
          <div><h1>FIRST</h1></div>
          <div><h1>FIRST</h1></div>
          <div><h1>FIRST</h1></div>
          <div><h1>FIRST</h1></div>
          <div><h1>FIRST</h1></div>
          <div><h1>FIRST</h1></div>

      </ion-slide>
      <ion-slide>
          <div><h1>SECOND</h1></div>
          <div><h1>SECOND</h1></div>

      </ion-slide>
      <ion-slide>
          <div><h1>THIRD</h1></div>
      </ion-slide>

    </ion-slides>
  </ion-content>

1 post - 1 participant

Read full topic

Jumio Integration Ionic + Capacitor

Viewing all 70424 articles
Browse latest View live