Questions tagged [ionic-framework]
Ionic is a front-end framework for developing native-feeling hybrid mobile apps with HTML and Sass. Traditionally, it runs on top of Cordova and Angular, but since Ionic 4 it supports Angular, React, Vue.js and Web Components running on top of Cordova or Capacitor.
48,237
questions
0
votes
0
answers
7
views
Issue while building ionic-angular project for latest xcode
angular project for iOS which is targeting latest xcode, but while compiling its giving this error against this ionic capacitor sync ios --verbose command
src/comet-chat/src/components/Messages/...
-2
votes
0
answers
13
views
Convert served Next JS with SSR web application to native mobile (ios android) using Capacitor
Basically I'm looking for ways to convert my web application to a native mobile application. But I don't want to move to native react or use SSG because it could take more work and could make our high ...
0
votes
0
answers
12
views
Laravel Fortify endpoints returning ERR_EMPTY_RESPONSE
Im trying to call my Laravel API from an Ionic application, but when i try it this error is showed on console "ERR_EMPTY_RESPONSE"
Calls to api routes are workin, Fortify endpoints are the ...
0
votes
0
answers
17
views
Ionic App with GA4 and FB Pixel with GTM not working in the version iOS
I have an application in ionic framework (version 7) with capacitor, at this moment I am integrating GA4 and FB Pixel with GTM (Google Tag Manager) in android it works perfectly but when I go to the ...
0
votes
1
answer
10
views
Changing colors of ngx-echarts charts
How to change the colors of all kind of charts in ngx-echarts?
Ive tried (html): <div echarts [options]="chartOption" [theme]="colorScheme" class="demo-chart"></...
0
votes
0
answers
22
views
How to make div insert avatar on ionic7, like this image
I want to make this on ionic 7 with ionic avatar using scss. But im still did'nt get it. How to made this?
Click to see the image
this is my scss code
ion-avatar {
--border-radius: 4px;
position: ...
0
votes
0
answers
12
views
Why is my OpenLayers map not showing on my Android device when it works fine in the browser within an Ionic React project?
I am working on integrating an OpenLayers map inside a Ionic React project. I am able to fully view and manipulate the map when running the application locally in browser. When I run on my device (...
0
votes
0
answers
20
views
Why is my splash screen being cut off in my Ionic app using Capacitor and Angular?
I have followed the Splash Screens and Icons tutorial, but for some reason, my splash screen is being cut off.
My icons and splash screen are the correct sizes, but I am still experiencing this ...
0
votes
0
answers
34
views
Error implement Google Maps script with places library on Ionic
Implementing the Google Places Autocomplete on my Ionic project, i get the next messages in console:
Warrent -> Google Maps JavaScript API has been loaded directly without a callback. This is not ...
0
votes
0
answers
9
views
Unable to access Ionic application ts files in browser
I'm working on ionic angular project and i cannot debug the code on web browser cause all am seeing is compiled js files and webpack is not available.
I'm using ionic Cordova run browser as I'm using ...
0
votes
1
answer
47
views
Take a photo from multiple cameras at the same time
Using Capacitor (preferable) or Swift/Kotlin, how can I take a photo on both the front and rear cameras at the same time? I'm looking to replicate the same functionality as the social media app BeReal....
-1
votes
0
answers
9
views
Ionic iOS Crashes/Slow with Large Files (> 15MB)
Ionic iOS crashes when i get largest files
Hi, I've always had a problem with ionic iOS, and it's the thing I've always complained about. This problem concerns the handling (or opening) of file-base64-...
-1
votes
0
answers
15
views
Ionic app deployment to iOS error "unable to open configuration settings file"
I have built a mole mash game in Ionic with Angular. I can play the game that I have coded on Mac in VSCode in browser and it runs as expected. I have included an image below.
Now I have deployed it ...
-1
votes
0
answers
17
views
How can I resolve the Firebase `GoogleService-Info.plist` error when building my iOS app using Ionic Appflow?
I am having trouble building my iOS app using Ionic Appflow. I am successfully able to build my Andorid app, but my iOS app keeps failing with the below error:
Terminating app due to uncaught ...
0
votes
0
answers
17
views
How to resolve ERR_NETWORK error when connecting to .NET Web API app hosted on IIS from Android mobile phone using Ionic app?
I have a .NET web API app hosted on an IIS website. I can successfully connect to the API from any other pc on the same network, but I get connection errors from my android mobile phone.
I have an ...
-1
votes
1
answer
32
views
Showing sub array content
I´m trying to show the content of array products at home.ts on home.html.
export class HomePage {
public products: any[] = [
{
theater: {
'30': {
id: '44',
name:...
1
vote
1
answer
19
views
How to open a pdf with Ionic Capacitor
I'm trying to open a pdf by pressing a button on Ionic Capacitor using the FileOpener plugin, but it doesn't work, would anyone know how to help me?
The pdf is stored into assets/documents
In the ...
0
votes
0
answers
7
views
Confirmation dialog before quitting the app Ionic6
I wonna show confirmation dialog before user will quit app.
I found this instruction in the docs
import { useBackButton, useIonRouter } from '@ionic/vue';
import { Plugins } from '@capacitor/core';
...
-1
votes
0
answers
11
views
simulate an iphone in xcode not possible with ionic
i am implementing an ionic application built with angular. i decided to use firebase as database. now when i create my code for the android platform using "ionic cap add android", the folder ...
0
votes
0
answers
9
views
Implement google fit plugin for ionic
Hello i'm trying to reach some data from google fit API from a ionic project, but i don't what plugin to use to connect to the API. I have 2 solutions which are allowed, one with capacitor, and the ...
0
votes
0
answers
6
views
Is it possible to use IonModal in a child page of a IonNav?
I have a SPA using the Ionic 7 Framework. I'm using the templated starter project with menu/navigation icons at the bottom of the screen; think Reddit, Facebook, Twitter iOS app screen layout.
On ...
0
votes
0
answers
40
views
Is it a problem to use normal HTML elements instead of Ionic elements?
I want to improve ionic app UI design in general but I used HTML tags instead of ionic tags to improve form fields so my question: Will this behavior cause ionic app to perform badly and have ...
0
votes
0
answers
8
views
Ionic Applink not working for Redirection
I am trying to build a feature where user gets an email verification link and on click it should open the app/ bring it to front. I am using ionic with cordova. I am trying to achieve this using the ...
0
votes
1
answer
27
views
Ionic app error: No 'Access-Control-Allow-Origin' header is present on the requested resource
I have a mobile app developed in ionic capacitor. The backend to the app is a .net core web api deployed on amazon elastic beanstalk. I am getting CORS error** No 'Access-Control-Allow-Origin' header ...
0
votes
0
answers
9
views
Problem with Deployment an ionic app on vhosting
I'm trying to solve some deployment problems on vhosting. I used to host an ionic-react website with node server on port 8080.
They closed that port for safety (as they said) and when I asked which ...
1
vote
2
answers
557
views
ion-select popover not working Chrome 114
I have a problem in ionic when try to open popover from ion-select interface=popover
My ionic info:
Ionic:
Ionic CLI : 6.20.1 (C:\Users\DELL\AppData\Roaming\npm\node_modules\@...
0
votes
0
answers
25
views
Pass data to Vue 3 page without reloading page
I'm creating an app using Vue3\Capacitor\Ionic. The HomePage.vue displays a map and uses various other functionality. This works fine but is quite heavy to load so I don't want to refresh the whole ...
0
votes
0
answers
6
views
Modal with error message on ios device while trying to share img on instagram with cordova-plugins/instagram, IONIC6
I'm using @awesome-cordova-plugins/instagram for sharing images from my ionic6 application to instagram.
On android works, but on ios pops out a modal with error message.
I tired also with @awesome-...
-1
votes
0
answers
13
views
Best way to store the token in an ionic cordova ios app?
what is the best way to store the token in an ionic cordova ios app in order to not lose it after removing the app of the switcher or killing the app
0
votes
0
answers
10
views
I need inlt a sample code to download a pdf file from url on my android
How can I download PDF file from URL with ionic angular capacitor. please some sapmle code. I need to download a Pdf file on My android.
I tried to used File-opener to download PDF file on android but ...
0
votes
0
answers
18
views
Dealing with changing views on Android in Angular: how can I ensure the app switches from web view to mobile view when orientation changes on tablet?
So the problem is to change views in angular android app. There are 2 views, mobile view and web view, but if I use tablet and open the app in landscape then it's in web view and after that I turn it ...
0
votes
0
answers
23
views
Updating Ionic and Cordova CLI causes error when syncing iOS with Capacitor
I am facing problem when trying to compile ionic app for ios, it works on this stack
Cordova CLI 10.0.0
Ionic CLI 6.18.0
Node.js 16.13.0
Node.js versions
12.22.7 / 14.18.1 / 16.13.0
npm 8.1.0
Yarn 1....
-1
votes
0
answers
13
views
capacitor-cordova-android-plugins in cordova filetransfer
I tried to delete the Whitelist in filetransder and also I tried to replace into Allowlist but still appearing this issue on my logs even I delete the filetransfer
Task :capacitor-cordova-android-...
0
votes
1
answer
27
views
Setting and passing array's values into class
I'm trying to pass children's array values through export class.
My code at tabs.page.ts is:
export class TabsPage {
navbarData: {
routeLink: string;
ionicon: string;
iconfirst: ...
0
votes
0
answers
8
views
failing to run an ionic app built with react on adroid studio
I've built in VScode an app using ionic & react frameworks. the app works and now i want to build it in android studio.
I've tried running the following commands to copy the app from vscode to ...
1
vote
0
answers
21
views
Error building my Ionic React app in Android due to 'invalid source release: 17' - how can I solve it?
I am trying to build an Ionic React app in Android and am not succeeding. The app works perfectly fine in the browser but won't build. I used the followings steps:
ionic capacitor build
npx cap add ...
0
votes
0
answers
16
views
cypress code coverage for ionic application
We followed code coverage for cypress typescript in ionic application.
folder structures /cypress/e2e/home.cy.ts,
cypress/plugins/index.ts
module.exports = (on, config) => {
require('@...
0
votes
0
answers
7
views
Electron: close browser tab opened via shell.openExternal
I'm setting up auth in my Electron app using ionic-appauth. I am trying to make the OS open the default browser to process the auth call and show the login page.
I implemented this using a custom ...
0
votes
0
answers
31
views
Ionic 7 - Ion-select component example of floating label does not render in browser
I'm developing an app using ionic 7 and angular.
I'm trying to use the ion-select component with floating label:
<ion-select label="Floating label" label-placement="floating">...
-1
votes
0
answers
24
views
designing a UI in ionic showing progress with labels [closed]
I am trying to design this UI using ionic. I was experimenting with progress bar and range slider but no luck especially putting the labels.
https://www.dropbox.com/s/a21elcy1c21plxp/Screenshot%202023-...
0
votes
0
answers
11
views
Connect to laravel websocket from an ionic project
`
your text`
Currently I'm trying to connect to laravel websocket 'beyondcode/laravel-websockets' from my ionic project . still theres no connection . ive already ran 'php artisan websocket:serve' so ...
0
votes
3
answers
55
views
How to pass icon name from array to
I´m trying to dinamically pass icon´s name to my html.
It´s working fine for ion-icons, but doesn't work for fontAwesome icons.
tabs.page.ts:
import { Component } from '@angular/core';
@Component({
...
0
votes
0
answers
20
views
Android Talkback not announcing tab count inside a tablist
Currently using Ionic 4 and there is no count being announced for tabs (e.g. Tab 1 of 3). On iOS this works perfectly fine, just on Android its not working.
Here is some example code:
<ul role=&...
-2
votes
1
answer
30
views
Error to add android folder to Ionic project using capacitor
I updated my capacitor packages to 5 like this :
"@capacitor/android": "^5.0.4",
"@capacitor/app": "^5.0.2",
"@capacitor/core": "^5.0.3&...
1
vote
0
answers
15
views
How to handle 'document' and 'localstorage' errors in Ionic Server-Side Rendering?
Problem running 'localstorage' and 'document' on Ionic SSR environment
I'm trying to implement Ionic Server Side rendering (alongside Angular) in my current Ionic Mobile Project, however I'm getting ...
0
votes
0
answers
34
views
What causes 'Permission denied' error when trying to capture video in Ionic 6 + Angular 14 using MediaCapture plugin?
I am having trouble capturing video on a mobile application built with Ionic 6, Angular 14 and Capacitor 4.
Background:
I am trying to integrate with a 3rd party SDK that requires video permissions in ...
1
vote
0
answers
18
views
How can i use the local css with easepick
I'm trying to use Easepick with Ionic for building a range datepicker but I don't like the idea of using an URL for the CSS.
Is there a way to use the local CSS that easy pick creates when you install ...
0
votes
0
answers
31
views
how to upload files to server in ionic capacitor (angular) app
I know of two potential ways:
using the web (Angular) HttpClient
I can not use anything that acts like a browser since I will get CORS issues on native devices. As far as I know there are two ways ...
-1
votes
0
answers
14
views
REST API details for Oracle Access manager password validation
We are trying to do multi factor authentication of Oracle Access Manager password using mobile app which is created in ionic framework. In order to do the validation, we need OAM REST API which can be ...
-1
votes
0
answers
22
views
After compressing file with gzip or brotli
I have website, an Android app and an IOS app build with ionic framework using angular,
I have compressed file inside www after build with this command gzipper compress --brotli --gzip ./www witch ...