Questions tagged [ionic7]
The ionic7 tag has no usage guidance.
62
questions
0
votes
0
answers
2
views
Ionic Mobile App Development With Live Reload Native
Is there a way to use live-reload in Ionic when developing a mobile app (iOS, Android), without going to a url in the browser? The whole idea of developing a mobile app is NOT to be run in a browser ...
0
votes
0
answers
18
views
Ionic 7 browser autoc0mplete doesn't work on input of type email or text but it does on others
I have implemented a ionic application with a login form...
in the login form I have 2 inputs, the first of type email an the second of type password, tryng to use browser autocomplete by the way it ...
0
votes
0
answers
91
views
Data path "" must have required property 'browserTarget'
I can't run my ionic serve because of this problem,
Error_Screen_Shot
Error: Schema validation failed with the following errors: [ng] Data path "" must have required property browserTarget....
0
votes
0
answers
16
views
Binding ngModel to ion-datetime button would cause unable to prase problem
I am tring to apply a ion-datetime-button in my page. In order to allow users to edit time, I want to use ngModel like this:
<ion-item>
<ion-label>Sleep Start at</ion-label>
&...
0
votes
0
answers
7
views
i am inserting the data but when get the data always give me null @capacitor-community/sqlite
public async insertData(data: any) {
const insertDataQuery = INSERT INTO farm_add ( officer_name, resolved_by, resolved_date, resolved_details, resolved_yn, visit_date, visit_purpose, visit_type ) ...
0
votes
0
answers
45
views
Register Ionic 7 Push Notifications Android
I'm trying to get configured Push Notifications for Android devices on a brand new Ionic app (v7). As I read in different docs and articles I did the following steps:
1.- Created my Firebase project ...
0
votes
0
answers
31
views
So I get the Error: NG0302 when I execute npm run test, but I don´t use custom pipes
So to put some context first my project is an Android app developed using Ionic 7, Angular and Capacitor.
I'm doing the unit tests by "npm run test" and at the moment just making sure there ...
0
votes
0
answers
17
views
ble.StartNotification() on Ionic 7 not working
I am using cordova-plugin-ble-central plugin in my project. scan(), connect() and write() functions work. However startNotification() does not work. I tried to connect to the same peripheral (same ...
0
votes
0
answers
34
views
Supabase Realtime Subscriptions with Ionic 7 and VueJS 3 not working properly
I am building an app with Ionic 7.1.1 and VueJS 3. Apart from that I am using Supabase for my data.
I am declaring my respective database / table as being realtime, as stated in the documentation. ...
1
vote
0
answers
98
views
Unable to Get Ionic 7 Form to work with Angular Standalone Components
I created an Ionic 7 app with tabs and picked the option to use standalone components. I then created a new page to be used for login, but cannot find the correct combination of imports to get it to ...
0
votes
0
answers
41
views
How to disable splash screen Ionic 7
I want to completely disable splash screen in ionic project. I use ionic 7, and it is new project with tabs. Do You have any idea how to do it?
I tried many things like instaling @capacitor/splash-...
0
votes
0
answers
95
views
Ionic 7 Swiper 11: How to set the parameter in Typescript?
I have my codes below. I wanted to set the parameters of the swiper slider using a script.
<swiper-container [options]="recentPostSliderOpts" class="discover-top-banner">
&...
0
votes
1
answer
39
views
Ionic 7 capacitor 5 internet access does not work
Ionic 7 internet access does not work. But status.connected (@capacitor/network) says true. I think android deny the connection.
package.json part:
{
"dependencies": {
"@angular/...
-2
votes
1
answer
85
views
How do I get my Ionic/React app to read/load my .env file?
I'm using Ionic 7, React 18, and included dotenv 16.3. I have created a blank ionic application and have added a file alongside package.json (.env)
NODE_ENV=local
REACT_APP_BASE_URL=http://localhost:...
0
votes
1
answer
27
views
Ionic - Changing line-height of ion-button
How to change the line-height of an ion-button?
The documentation doesn't provide any guidance on this.
I've tried various selectors without success:
.row-button ion-button
.row-button ion-button ...
0
votes
1
answer
32
views
Ionic Angular - Access body selector in page scope
I need to access the "body" selector in my .scss file. However, I can't access the body selector within the page scope, only in the global.scss or variables.scss files. Is there a way to do ...
0
votes
2
answers
64
views
ionic 7 @ionic-native/call-number/ngx when testing in ANDROID, returning plugin_not_installed
ionic 7 @ionic-native/call-number/ngx when testing in ANDROID, returning plugin_not_installed
Added in app.module.ts file
Added a function
When testing in ANDROID the this.issue returning ...
0
votes
0
answers
69
views
ngx-translate "Http failure response for /assets/i18n/... 0 OK" error on Ionic 7
The error doesn't happen on the development server (ionic serve), it occurs when I try to test the app on the device after build.
My app.module.ts is:
...
import { HttpClientModule, HttpClient } from '...
0
votes
1
answer
49
views
How to resolve NullInjectorError
I'm creating an app using Ionic/angular for front-end and node.js for back-end, ionic version 7 is what i'm using, i'm having issue on doing sign up page.
Code below is the signup.page.ts
import { ...
1
vote
0
answers
114
views
Swiper is not sliding in some situations
The scrolling operation is successfully from the area I marked in red. But scrolling is not possible outside the red area. I wonder what is the reason? I am using Ionic 7
Screenshot
<swiper-...
0
votes
0
answers
60
views
multiple ion-datetime-button and ion-datetime created dynamically inside v-for
I am trying to create multiple instances of ion-datetimeButton and ion-datetime dynamically inside the v-for with ion-buttons
<ion-item v-for="(task, index) in alltasks">
<ion-...
0
votes
0
answers
22
views
No margin between header toolbar and content on Android preview Ionic Framework VueJs 3
i have some issue with margin between header toolbar and content.
on iphone preview i just got perfect margin but when i switch to android, theres no gap between them. the header ovveride the content.
...
0
votes
2
answers
40
views
How to dynamically add dates to Ionic ion-datetime
I'm trying to create an Ionic calendar using ion-datetime. In it I want to mark several dates of the Month view. Those dates are retrieved through an API. The issue is here that the calendar is ...
0
votes
0
answers
46
views
Update notification content using @capacitor/local-notifications (5.0.6) plugin
I'm developing a workout application with Ionic 7 (ReactTS) using Capacitor.
I would like to display a notification with the remaining rest time before the next set to the user.
The displayed ...
0
votes
0
answers
163
views
How to style ion-input labels on ionic 7?
I'm migrating an app to ionic 7 which encourage stop using <ion-label> for ion-input among others. In all the guides I am seeing I see how you only have to put the text in the slot of ion-input ...
0
votes
2
answers
61
views
ion-item loses start padding when placed inside ion-item
I have multiple ion-input elements generated by ngFor. I have fill set to outline to place a border around it, which applies padding. When the div generating the elements is inside another div, all ...
0
votes
1
answer
25
views
ion-datetime issue when 2 conditional values
I have a simple ion-datetime on my stackblitz and I'm trying to add a default value and min hour available.
If I only have the default value in my condition: it's working well, If I only have the min ...
0
votes
0
answers
62
views
ScreenOrientation in IONIC 7 and Capacitor 5.2.3
I have Ionic 7.1.1 and Capacitor 5.2.3, and I can't find on the official page how to install the screen-orientation plugin. Also, I see an end-of-life notice on the page. I don't quite understand what ...
0
votes
0
answers
138
views
Angular Ionic 7 Local Notification with capacitor plugin - Daily notification is not working
I have the same issue as many others here: I want to build a daily notification on which time is selected in frontend and want to execute a daily notification at the same time every day. I tried the ...
0
votes
1
answer
116
views
TypeORM Error initialising the Database -- TypeError: Cannot read properties of undefined (reading 'Database')
I use TypeORM to wrap my database. In my Angular Ionic 7 app I initialise the database the following in my AppComponent but receive an error during the initialisation in the platform browser.
export ...
0
votes
1
answer
39
views
Property 'last' does not exist on type 'NavController'
if (this.nav.last().instance instanceof SupplierSelectPage) { this.form.controls['SupplierName'].markAsTouched(); }
I have updated the Ionic version to 7, after that, I am facing issues on the ...
0
votes
1
answer
83
views
How to set up Ionic Auto Height Sheet modal in Vue 3
I am attempting set up an Ionic Auto Height Sheet modal in a Vue 3 project (https://ionicframework.com/docs/api/modal#auto-height-sheet). See my code below.
On ion-tab-button #3, I added id="open-...
-1
votes
1
answer
126
views
Unable to create a new Ionic project
Every time when I try to create a new ionic angular project using ionic start, it triggers an error in the console.
Error:
Network connectivity error occurred, are you offline? If you are behind a ...
1
vote
0
answers
42
views
Ionic / Cordova Plugin for querying the SSID and BSSID of the connected WiFi network without requesting location services
I am looking for a plugin for Ionic 7 to get the SSID and BSSID of the connected WiFi network. I was planning to use wifiwizard2, however it requires location services and with this I am running into ...
0
votes
0
answers
105
views
cdk-virtual-scroll-viewport dynamic height
I am working on a Ionic 7 application with Angular 16. In this version of Ionic, ion-virtual-scroll was deprecated and they recommend to use the @angular/cdk ScrollingModule. Ionic Virtual Scroll ...
2
votes
1
answer
241
views
ionic swiper does not work when conditionally rendered
i am using ionic 7 and swiper component like below
<ng-container *ngIf="core.loggedIn === true">
<swiper-container #swiper (afterinit)="swiperReady()" [pagination]=&...
0
votes
0
answers
71
views
Alternative for displayFormat property for ion-datetime in Ionic 7
In Ionic 5 it was possible to customise time formats of ion-datetime using the property displayFormat. eg. <ion-datetime displayFormat="HH:mm" ....
In Ionic 7 this does not seem to be ...
0
votes
1
answer
108
views
How do I unit testing for Ionic Capacitor Status Bar?
I run my unit testing and I got
Error: "StatusBar" plugin is not implemented on web
Currently this is from my app.component.ts
loadTheme = (theme) => {
if(this.platform.is('capacitor')...
0
votes
1
answer
52
views
I can't root my components in an Angular project with Ionic
I'm using Angular 16.0.0 and Ionic 7.0.0
Error: NG04002: Cannot match any routes. URL Segment: 'home'
I try navigate to my 'home' component, I'm using:
this.router.navigate(['/home']);
But it isn't ...
0
votes
1
answer
290
views
How to Use Capacitor Google Maps Plugin with Ionic 7 Modals
No matter how much I try to hide HTML elements, make them transparent, not visible o not display them at all, I haven't found a specific way to make the HTML elements transparent enough to use ...
-1
votes
1
answer
714
views
how to set up SQLite database using capacitor for ionic application with angular?
I am using the Ionic framework with Angular and Capacitor to build a chat application. I want to implement storage in my application. I am trying to set up an SQLite database for my Capacitor project. ...
0
votes
0
answers
14
views
Different Menu for Different page in Ionic
My first-page wont respond and scroll as my second-page menu is overlaying its hidden menu
I'm trying to add a menu for my staff page for a different page, I tried copying the existing menu and ...
1
vote
1
answer
61
views
Unknown html tag ion-breadcrumbs, the tag is not recognized by ionic-angular project
ionic breadcrumbs doc
<ion-breadcrumbs>
<ion-breadcrumb href="#home">Home</ion-breadcrumb>
<ion-breadcrumb href="#electronics">Electronics</ion-...
0
votes
0
answers
175
views
Ionic 7 viewer and pdf generator plugin
Which plugin to install to preview and download the PDF, and use with ionic 7, I tried cordova-plugin-printer and it is giving conflicts with the dependencies version, which one to use with ionic 7?
I ...
0
votes
2
answers
230
views
angular fire auth with ionic 7 causes NullInjectorError: No provider for InjectionToken angularfire2.app.options
I am using ionic 7 and angular fire for authentication using firebase. Lot of code on the internet uses older way of app.module.ts which is no longer the way. So, i created a new firebase.module as ...
1
vote
1
answer
271
views
ion-datetime-button in ion-item not 100% height
I have 3 ion-items with ion-select and ion-datetime-button.
The ion-items with ion-datetime-button do not have the same height as the one with ion-select. They are all wrapped in an ion-col (with the ...
0
votes
0
answers
129
views
slideTo(1) is working but slideTo(0) is not working with swiper js using ionic 7 + Angular
Below is working
<swiper-container id="swiper" (transitionstart)="slideTransitionStart()" #swiper>
<swiper-slide *ngFor="let image of bannerList">
...
0
votes
0
answers
162
views
IonInput fill outline property
I am having trouble implementing IonInput in outline style.
I need to point out that the outline appears for a while but then disappears for good. I also need to mention I am not using it inside of ...
1
vote
1
answer
251
views
Error: Unable to create photo on disk on Android - Ionic using Capacitor Camera Plugin
I am trying to use the Capacitor Camera Plugin in Ionic (v7) for an Android App (have not tested in iOS, but no issue on Web). This is the code to get the image:
const image = await Camera.getPhoto({
...
1
vote
0
answers
192
views
How to fix 'Unable to start the daemon process' error when running ionic capacitor on Android studio?
I am trying to run an ionic-angular app on android studio
When running ionic capacitor run android i receive the following error :
[capacitor] [error] Starting a Gradle Daemon, 7 stopped ...