I see that it is possible to specify a custom nav animation using:
IonicModule.forRoot({navAnimation: myAnimation})
However, I would like to also provide a custom swipe back gesture override the existing implementation. How can I accomplish that?
1 post - 1 participant
it happen on iOS device for ios12.
Xcode log says
[reports] Main Thread Checker: UI API called on a background thread: -[UIApplication canOpenURL:]
PID: 10326, TID: 2101166, Thread name: (none), Queue
but for second try, it call directly.
I don’t think it’s problem of call number plugin because when I call with +tel:~~~ it also happened.
how can I solve this problem?
1 post - 1 participant
Hi I want to ask, so I have a problem, I want to pass value to the next page but it won’t work. In my scenario I have two page to the same destination (for example: first scenario : A -> C, and the second scenario : A -> B -> C), for first scenario it can pass value and apply it to C page, but for the second scenario the value is already passed but it won’t apply to the variable on page C. I think routing code from source and destination is same. Here is the code… and debug screenshot on second scenario
Page A -> page C
gotoPerpanjanganStnk() {
this.router.navigate([‘perpanjangan-stnk’], {
state: {
flag: 0,
agreement: this.agreements
}
});
}
Page B -> Page C
gotoPerpanjanganStnk() {
this.popoverCtrl.dismiss();
this.router.navigate(['perpanjangan-stnk'], {
state: {
flag: 1,
agreement: this.agreement
}
});
}
In page C
constructor(private router: Router, private activatedRoute: ActivatedRoute,
private questionService: QuestionService, private agreementService: AgreementApiService) {
this.waiting = false;
this.activatedRoute.queryParams.subscribe(() => {
const extras = this.router.getCurrentNavigation().extras.state;
if (!extras) {
return;
}
this.flag = extras.flag;
this.agreements = extras.agreement;
this.questionsAgreement = this.questionService.getAgreementForm(this.agreements, 0);
// this.questionsAssetInfo = this.questionService.getAssetInfoForm(SharedVariables.agreement);
});
}
1 post - 1 participant
I have a array that i as showing using ion select, user need to select value from it (and can select only one value)
<ion-title>Header</ion-title>
<ion-item>
<ion-label>Operating System</ion-label>
<ion-select ok-text="Okay" cancel-text="Nah">
<div *ngFor="let companyName of allCompaniesName">
<ion-select-option value={{companyName}}>{{companyName}}</ion-select-option>
</div>
</ion-select>
</ion-item>
<ion-item>
<ion-label>Operating System</ion-label>
<ion-select ok-text="Okay" cancel-text="Nah" fullscreen>
<div *ngFor="let yearDescription of allYearsDescription">
<ion-select-option value={{yearDescription}}>{{yearDescription}}</ion-select-option>
</div>
</ion-select>
</ion-item>
Next
<ion-title>Footer</ion-title>
1 post - 1 participant
I’m absolutely exhausted by trying to get the location of user using Geolocation plugin.
But the problem is that if the GPS is already connected before launching my app, it works, otherwise it never works.
Meaning that If turn on the location on device after launching my app, Geolocation plugin never works.
here is the code I’m trying
if (Capacitor.isPluginAvailable('Geolocation')) {
Plugins.Geolocation.getCurrentPosition().then(location => {
this.alertCtrl.create({
animated: true,
header: `Platform: ${Capacitor.getPlatform()}`,
subHeader: 'Coordinates: ',
message: `Latitude: ${location.coords.latitude}\n Longitude: ${location.coords.longitude}`
}).then(alertEl => alertEl.present());
}).catch(error => {
console.log('Error:', error);
this.alertCtrl.create({
animated: true,
header: `Error Occured`,
// subHeader: error,
message: error.message
}).then(alertEl => alertEl.present());
})
}
This is the simplest method and doing nothing anything rocket science.
How can I make my app to fetch the user location if the device GPS was disabled and user just enabled after launching my app.
1 post - 1 participant
Hello everyone,
I’m Phil and this is my first time trying ionic. I can’t make it to work tho and it’s been more than 2 week already trying to run it so I think it’s time to look for some help.
No matter what I do if I try
ionic server --lab
I got this
[INFO] Looks like @ionic/lab isn't installed in this project.
This package is required for this command to work properly. The package provides a CLI utility, but the ionic-lab
binary was not found in your PATH.
? Install @ionic/lab?
Even @ionic/lab@3.1.7 is actually installed. If I try saying yes I got a final error;
[ERROR] ionic-lab command not found.
And that is it, I can not run the lab.
Here some info of my system:
Angular CLI: 10.0.3
Node: 14.0.0
OS: linux x64
Angular: 10.0.4
ionic --version 5.4.16
Thanks a lot for real.
1 post - 1 participant
Hi, I’m new to ionic, in fact I heard about it yesterday and I want to use it at work because i think it’s very cool to code once and run across all platforms.
The thing is I’m confused on how it works. I did a tutorial about ionic-react yesterday and I find it great but it did not show any server side code and that’s exactly what I’m planning to do.
In my use case I need my frontend to connect to a socket. Precisely, I have data in the cloud and i need to pull them over socket and show them at the frontend. For this I will need a server (probably node js) to pull the data over a socket and them show these data in the frontend.
Now this is confusing since the ionic app is started with the
ionic serve
command but node js server must also be started with the
npm start
command. Which one of them should run here?
Also how to deploy my app to ios or android if a node js is needed? should the entry point be ionic serve or npm start ? I assume the app will not work if the node js server is not running in the background, and how would it run on mobile!?
Should I maybe deploy the node js server in the cloud (for example in heroku) and then expose the IP adress, which I ll connect to in my frontend? or connect to the socket from my mobile? is that the right way to do it?
I’m very confused, I would appreciate it if someone can guide me on this.
1 post - 1 participant
Hi,
I am using the cordova plugin background geolocation from ionic native to be able to track my location in my app. I regularly send the location of the device to an external API.
This works quite well when I am not on the app but whenever I lock my screen, nohting happens and the location is no longer updated.
Is it a normal behaviour ? Would you have any clues on how to solve that ?
Thanks!
2 posts - 2 participants
(topic withdrawn by author, will be automatically deleted in 24 hours unless flagged)
1 post - 1 participant
I used ionic generate SSL and added to dev script, working fine.
But after build not working anymore and got the old error. So if there is any solution?
I also tried this solution. not working
http://ivancevich.me/articles/ignoring-invalid-ssl-certificates-on-cordova-android-ios/
1 post - 1 participant
I’m facing the following issue when using @capacitor/ios: 2.3.0 (also previously on 2.2.0 too)
I’ve replace the default capacitor splashscreen with one of my own, however whenever I run my app:
-capacitor’s logo on a white background briefly displays
-my custom splash screen shows
-it hides when the app is fully loaded.
No idea where capacitor’s logo is coming from. I’ve searched all files and it’s not there.
below is part of capacitor.config.json:
...
"plugins": {
"SplashScreen": {
"launchAutoHide": false,
"splashFullScreen": false
},
...
1 post - 1 participant
1 post - 1 participant
I have a PWA test site and a user is seeing the fonts displayed as Italic in their browsers, whereas for me they are displaying normally?
Does anyone know why this would happen?
https://test.comformark.com.au
1 post - 1 participant
Beyondant presenting custom digital business card services including unique features and much more which will give you new and unique experience about digital world and work efficiency.
1 post - 1 participant
Hello!
I’ve already looked for it in the forum without any luck.
Has any of you been able to find a way for disabling the hardware back button or to link other events to it?
With Ionic 3 it worked like a charm but with Ionic 5 (and even Ionic 4) i’m not able to lock it.
Thanks!
1 post - 1 participant
When i run ionic serve i have following error :
[ **INFO** ] Browser window opened to **http://localhost:8101** !
[ng] ℹ ｢wdm｣: wait until bundle finished: /
[ng] Date: **2020-07-20T08:51:26.059Z**
[ng] Hash: **0f4a36509e9bacfa61fa**
[ng] Time: **25653** ms
[ng] chunk { **default~flightserachdetails-flightserachdetails-module~map-track-befor-map-track-befor-module~tab1-t~2e15eaae** } **default~flightserachdetails-flightserachdetails-module~map-track-befor-map-track-befor-module~tab1-t~2e15eaae.js, default~flightserachdetails-flightserachdetails-module~map-track-befor-map-track-befor-module~tab1-t~2e15eaae.js.map** (default~flightserachdetails-flightserachdetails-module~map-track-befor-map-track-befor-module~tab1-t~2e15eaae) 400 kB **[rendered]**
[ng] chunk { **default~flightserachdetails-flightserachdetails-module~tab1-tab1-module** } **default~flightserachdetails-flightserachdetails-module~tab1-tab1-module.js, default~flightserachdetails-flightserachdetails-module~tab1-tab1-module.js.map** (default~flightserachdetails-flightserachdetails-module~tab1-tab1-module) 700 kB **[rendered]**
[ng] chunk { **default~pages-deprt-info-deprt-info-module~tab2-tab2-module** } **default~pages-deprt-info-deprt-info-module~tab2-tab2-module.js, default~pages-deprt-info-deprt-info-module~tab2-tab2-module.js.map** (default~pages-deprt-info-deprt-info-module~tab2-tab2-module) 27 kB **[rendered]**
[ng] chunk { **es2015-polyfills** } **es2015-polyfills.js, es2015-polyfills.js.map** (es2015-polyfills) 285 kB **[initial]** **[rendered]**
[ng] chunk { **flightsearch-flightsearch-module** } **flightsearch-flightsearch-module.js, flightsearch-flightsearch-module.js.map** (flightsearch-flightsearch-module) 18.8 kB **[rendered]**
[ng] chunk { **flightserachdetails-flightserachdetails-module** } **flightserachdetails-flightserachdetails-module.js, flightserachdetails-flightserachdetails-module.js.map** (flightserachdetails-flightserachdetails-module) 3.44 kB **[rendered]**
[ng] chunk { **home-page-home-page-module** } **home-page-home-page-module.js, home-page-home-page-module.js.map** (home-page-home-page-module) 14.3 kB **[rendered]**
[ng] chunk { **iraqi-iraqi-module** } **iraqi-iraqi-module.js, iraqi-iraqi-module.js.map** (iraqi-iraqi-module) 4.75 kB **[rendered]**
[ng] chunk { **main** } **main.js, main.js.map** (main) 82.8 kB **[initial]** **[rendered]**
[ng] chunk { **map-track-befor-map-track-befor-module** } **map-track-befor-map-track-befor-module.js, map-track-befor-map-track-befor-module.js.map** (map-track-befor-map-track-befor-module) 144 kB **[rendered]**
[ng] chunk { **pages-deprt-info-deprt-info-module** } **pages-deprt-info-deprt-info-module.js, pages-deprt-info-deprt-info-module.js.map** (pages-deprt-info-deprt-info-module) 3.18 kB **[rendered]**
[ng] chunk { **pages-metar-metar-module** } **pages-metar-metar-module.js, pages-metar-metar-module.js.map** (pages-metar-metar-module) 2.58 kB **[rendered]**
[ng] chunk { **polyfills** } **polyfills.js, polyfills.js.map** (polyfills) 237 kB **[initial]** **[rendered]**
[ng] chunk { **runtime** } **runtime.js, runtime.js.map** (runtime) 9.91 kB **[entry]** **[rendered]**
[ng] chunk { **styles** } **styles.js, styles.js.map** (styles) 182 kB **[initial]** **[rendered]**
[ng] chunk { **tab1-tab1-module** } **tab1-tab1-module.js, tab1-tab1-module.js.map** (tab1-tab1-module) 29.3 kB **[rendered]**
[ng] chunk { **tab2-tab2-module** } **tab2-tab2-module.js, tab2-tab2-module.js.map** (tab2-tab2-module) 21 kB **[rendered]**
[ng] chunk { **tab3-tab3-module** } **tab3-tab3-module.js, tab3-tab3-module.js.map** (tab3-tab3-module) 13.3 kB **[rendered]**
[ng] chunk { **tabs-tabs-module** } **tabs-tabs-module.js, tabs-tabs-module.js.map** (tabs-tabs-module) 7.93 kB **[rendered]**
[ng] chunk { **vendor** } **vendor.js, vendor.js.map** (vendor) 4.98 MB **[initial]** **[rendered]**
[ng] chunk { **weather-maps-weather-maps-module** } **weather-maps-weather-maps-module.js, weather-maps-weather-maps-module.js.map** (weather-maps-weather-maps-module) 343 kB **[rendered]**
[ng]
[ng] **ERROR in ./node_modules/@ionic/core/dist/esm-es5/loader.mjs 4:11-19**
**[ng]** Can't import the named export 'a' from non EcmaScript module (only default export is available)
[ng] **ERROR in ./node_modules/@ionic/core/dist/esm-es5/loader.mjs 6:8-21**
**[ng]** Can't import the named export 'b' from non EcmaScript module (only default export is available)
[ng] **ERROR in ./node_modules/@ionic/core/dist/esm-es5/loader.mjs 5:8-15**
**[ng]** Can't import the named export 'g' from non EcmaScript module (only default export is available)
[ng] **ERROR in ./node_modules/@ionic/core/dist/esm-es5/index.mjs 7:0-205**
**[ng]** Can't reexport the named export 'a' from non EcmaScript module (only default export is available)
[ng] **ERROR in ./node_modules/@ionic/core/dist/esm-es5/index.mjs 7:0-205**
**[ng]** Can't reexport the named export 'b' from non EcmaScript module (only default export is available)
[ng] **ERROR in ./node_modules/@ionic/core/dist/esm-es5/index.mjs 7:0-205**
**[ng]** Can't reexport the named export 'c' from non EcmaScript module (only default export is available)
[ng] **ERROR in ./node_modules/@ionic/core/dist/esm-es5/index.mjs 7:0-205**
**[ng]** Can't reexport the named export 'l' from non EcmaScript module (only default export is available)
[ng] **ERROR in ./node_modules/@ionic/core/dist/esm-es5/index.mjs 7:0-205**
**[ng]** Can't reexport the named export 'm' from non EcmaScript module (only default export is available)
[ng] **ERROR in ./node_modules/@ionic/core/dist/esm-es5/index.mjs 7:0-205**
**[ng]** Can't reexport the named export 'p' from non EcmaScript module (only default export is available)
[ng] **ERROR in ./node_modules/@ionic/core/dist/esm-es5/index.mjs 7:0-205**
**[ng]** Can't reexport the named export 't' from non EcmaScript module (only default export is available)
[ng] **ERROR in ./node_modules/@ionic/core/loader/index.mjs 21:0-47**
**[ng]** Can't reexport the namespace object from non EcmaScript module (only default export is ava **ilable)**
[ng] **ERROR in ./node_modules/@ionic/core/dist/esm-es5/overlays-10640d86.js 177:37**
**[ng]** Module parse failed: Unexpected token (177:37)
[ng] You may need an appropriate loader to handle this file type.
[ng] | case 1:
[ng] | _a.trys.push([1, 4, , 5]);
[ng] > return [4 /*yield*/, import('./index-69c37885.js')];
[ng] | case 2:
[ng] | mod = _a.sent();
[ng] **ERROR in ./node_modules/@ionic/core/dist/esm-es5/core-ca0488fc.js 74:11**
**[ng]** Module parse failed: Unexpected token (74:11)
[ng] You may need an appropriate loader to handle this file type.
[ng] | return module[exportName];
[ng] | }
[ng] > return import(
[ng] | /* webpackInclude: /\.entry\.js$/ */
[ng] | /* webpackExclude: /\.system\.entry\.js$/ */
[ng] **ERROR in ./node_modules/@ionic/core/dist/esm/polyfills/index.js 7:18**
**[ng]** Module parse failed: Unexpected token (7:18)
[ng] You may need an appropriate loader to handle this file type.
[ng] |
[ng] | if (!win.customElements || (win.Element && (!win.Element.prototype.closest || !win.Element.prototype.matches || !win.Element.prototype.remove))) {
[ng] > promises.push(import('./dom.js'));
[ng] | }
[ng] |
[ng] ℹ ｢wdm｣: Failed to compile.
ionic info
Ionic:
Ionic CLI : 5.4.16 (/usr/local/lib/node_modules/ionic)
Ionic Framework : @ionic/angular 4.11.10
@angular-devkit/build-angular : 0.13.10
@angular-devkit/schematics : 7.2.4
@angular/cli : 7.3.9
@ionic/angular-toolkit : 1.4.1
Cordova:
Cordova CLI : 9.0.0 (cordova-lib@9.0.1)
Cordova Platforms : none
Cordova Plugins : no whitelisted plugins (0 plugins total)
Utility:
cordova-res : not installed
native-run : not installed
System:
Android SDK Tools : 26.1.1 (/Users/macbook/Library/Android/sdk)
NodeJS : v12.18.2 (/usr/local/bin/node)
npm : 6.14.5
OS : macOS Catalina
Xcode : Xcode 11.5 Build version 11E608c
i did following steps :
ionic repair : same result .
Remove node_modules , and package-lock.json : same result .
any idea please ?
1 post - 1 participant
this.platform.ready().then( () => {
setTimeout(function () {
const browser = this.iab.create("https://www.awebsite.co.uk", '_self', options)
}, 25);
})
if I write this.iab.create outside of setTimeout, it works , but inside of it it’s not opened!
I should use setTimeout…
how can I solve this problem?
1 post - 1 participant
Hi! I’m trying to use the BarcodeScanner plugin from Ionic Native but it doesn’t work. When I tried debugging it this is what I got:
D/DecodeHandler: Found barcode in 150 ms
D/Capacitor: Unable to find a Capacitor plugin to handle requestCode, trying Cordova plugins 47740
D/ViewRootImpl@a7f3c53[MainActivity]: stopped(false) old=true
D/Capacitor: App restarted
Here’s my code:
const scanCode = async() => {
var barcodeData = await BarcodeScanner.scan();
var data = barcodeData.text;
//do something with data
)
Please let me know what other information I can provide. Thanks!
1 post - 1 participant
Hi, currently I want to log the time that user spend on my app, and I referred the following code to record the timestamp.
this.platform.ready().then(() => {
this.platform.pause.subscribe(() => {
console.log('****APP PAUSED**** => log end time');
});
this.platform.resume.subscribe(() => {
console.log('****APP RESUMED**** => log start time');
});
});
It can work as expected. However it cannot handle the case when user force quit the app, it will not trigger the pause event, which means it cannot logged the “paused” time.
After read the log on iOS, I find out that there is an event that fires and print a message(APP INACTIVE) everytime when the app is not in active status (like hide in background or when showing multi-task panel).
I’d like to ask is there anyway that can bind some funtions to that event to better handle the app status? And I can log the end time even when user force quit the app. Thanks in advance.
1 post - 1 participant