ionic4

问题 I'm currently creating my first PWA with Stencil, PWA Toolkit and Ionic 4. I can not explain myself a behavior when switching from one page (ion-content) to another page. Here the situation: CSS 1st page (app-home): ion-content { --background: pink; } CSS 2nd page (app-data): ion-content { --background: white; } With the statement: this.router.push ('/data', 'forward'); the app changes from page 1 to page 2. But the background remains pink and does not change as expected to white. When I

问题 I am trying to upload an image using ionic 4 and ios. The error I keep getting is: TypeError: undefined is not a constructor (evaluating 'new _ionic_native_file_ngx__WEBPACK_IMPORTED_MODULE_2__["FileReader"]()') Here is the relevant code: startUpload(imgEntry) { this.file.resolveLocalFilesystemUrl(imgEntry.filePath) .then(entry => { (<FileEntry> entry).file(file => this.readFile(file)); }).catch(err => { this.presentToast('Error while reading file.'); }); } readFile(file: any) { const reader

问题 Does anyone knows the way of adding font-awsome to new Ionic 4 project (currently I'm using 4.0.0-beta.15 ). Adding it to v3 is nicely explained here: https://charlouze.github.io/ionic/2017/05/31/Ionic-3-and-Font-Awesome.html and it works great for Ionic V3, but unfortunatelly not V4. 回答1: install font-awesome npm install font-awesome --save --save-exact copy.config.js copyFonts: { src: [ '{{ROOT}}/node_modules/ionicons/dist/fonts/**/*', '{{ROOT}}/node_modules/ionic-angular/fonts/**/*', '{

问题 css problem with ion-select that has a button inside a shadow root. I need the default value --padding-top:10px,--padding-end:8px,--padding-bottom:10px,--padding-start:16px for this, but it is a first element and assumes the value applied as shown below. below image contains color box which is ion-select and unable to control size of this box.code for ion-select is below. Can someone help me? <ion-col size="2" style="padding:0"> <div class="colorselect color_{{color.slice(1,7)}}"> <ion-select

问题 i user file transfer for download file that it's need File native also in ionic v3 i used it and hasn't any problem but now in ionic v4 when i use that, it's got Error : Property 'dataDirectory' does not exist on type 'File' my code => download.page.ts download() { const fileTransfer: FileTransferObject = this.transfer.create(); this.plt.ready().then(() => { const url = 'http://www.test.com/file.mp3'; fileTransfer.download(url, this.file.dataDirectory + 'file.mp3').then((entry) => { console

问题 I am working in my Ionic 4 app and I have made the login/register system. When the user login, after that the user will able to visit the page and when the user is not login and try to visit the page, it will get redirect to the login page. This is my userlogin.page.ts : async UserLoginDetails($soctype, $socid) { const loading = await this.loadingController.create({ message: 'Please Wait', duration: 1100, translucent: true, }); await loading.present(); const userdetailslogin = { email: this

问题 I need to disable the default ion-ripple-effect in the `ion-button'. <ion-button> <ion-icon slot="icon-only" name="star"></ion-icon> </ion-button> I can't disable the pointer-events as I need it. PS: I've referred the following posts and could not find a proper solution for Ionic 4. How to remove click effect of an ion-item Disable ripple effect on element 回答1: I think it's only included with Android so you can set mode="ios" on the button to avoid that effect. Yeah so I just checked the

问题 async presentLoading() { const loading = await this.loader.create({ duration: 2000, showBackdrop:false, cssClass:'sa', spinner:'false', message:` <div class="custom-spinner-container"> <img class="loading" width="120px" height="120px" src="assets/loader1.gif" /> </div>` }); return await loading.present(); } 回答1: You can just simply achieve it with css //Header of file import { LoadingController } from "@ionic/angular"; //In the constructor constructor(public loadingCtrl: LoadingController) {

问题 I have html2canvas installed and imported in home.page.ts in my Ionic4 angular test project. I have a plain 100px X 100px, yellow background div with a single line of text. I am passing this div to html2canvas to be downloaded as png. html2canvas is listing all steps (no errors) in the console and generating the png with the same size as the given div but the div is empty.It does not have the color of the div or the text. Changing the size of the div takes effect properly meaning the

问题 So I know how to get the selected value using the ionChange event, but how do I get the selected index. For example if i was to select the 3rd value down in a dropdown how can I get the selected index (2) rather than the value selected? 回答1: You can do something like ths:- <ion-select placeholder="Select One"> <ion-select-option value="id1">Value1</ion-select-option> <ion-select-option value="id2">Value2</ion-select-option> </ion-select> By this when you will select any particular option,