That code is a few years old, so not surprising that it doesn’t work any more. Did you follow the link from the error message and understand it and follow what the solution for it is?
Image not displaying while displaying contacts
Problem working with an imported project in ionic 3 ( failed to load index.html )
I had a similar problem, I searched for stackoerlow answers, and on forums, but I couldn’t fix it. I then installed yarn using the command yarn install and then ran the app ionic again and ran successfully. However, I am not sure if it is due to the lack of libraries of yarn, but after I successfully ran the yarn install command, I would like to comment.
Floating Action Button as Input type="file"
thanks @Rishab24
i need a multiplatform app.
what can i use for ios?
there’s no way to make it without plugins?
Ionic 4 native camera oddity
This is a strange one that I can’t quite understand and I think that showing the code first will be best
component.ts
this.camera.getPicture(options).then(
(imageData: string): void => {
const mp4Checker = imageData.slice(-3);
if (mp4Checker === 'mp4') {
console.log('imageData', imageData); // <-- 'path/to/storage/file.mp4'
message.video = imageData;
console.log('after assignment', message.video); // <-- 'path/to/storage/file.mp4'
this.chatService.sendVideo(message);
} else {
console.log('imageData', imageData); //<-- 'string/to/storage/file.jpg'
message.image = imageData;
console.log('after assignment', message.image); // <-- undefined
this.chatService.sendMessage(message);
}
this._uploadMedia(imageData);
},
err => {
console.log('error -->', err);
},
);
now If I move the logic to separate function it fixes the undefined
problem:
this.camera.getPicture(options).then(
(imageData: string): void => {
this._uploadMedia(imageData);
},
err => {
console.log('error -->', err);
},
);
private _uploadMedia(media: string): void {
const mp4Checker = media.slice(-3);
console.log('_uploadMedia', media, mp4Checker);
if (mp4Checker === 'mp4') {
message.video = media;
console.log('look at message.video', message); // <--'path/to/storage/file.mp4'
} else {
message.image = media;
console.log('look at message.image', message); //<--'path/to/storage/file.jpg'
}
}
Why in the first example can I not assign it but after passing the reference to the helper function I am only then finally able to?
Floating Action Button as Input type="file"
IONIC IS MALTIPLATFORM APP
same plugin can be used for ios or windows
Get the cursor position inside ion-textarea
HII I have done this in my project
one .html site you have to use Reference Variables (#input)
here is html code
<ion-textarea rows="2" #input>
</ion-textarea>
on ts side inport viewchild its used to bind element attribute
import {ViewChild} from '@angular/core';
export class Page {
@ViewChild('input') myInput ;
}
````this.myInput.setFocus();
`
My ionic app suddenly stuck on splash screen before it was running
Error when subscribing to Screen Orientation changes
I am trying to use cordova’s ScreenOrientation module to get screen orientation changes. Using their example online, I’ve written this code in my app.component.ts:
import { Component } from '@angular/core';
import { Platform } from '@ionic/angular';
import { SplashScreen } from '@ionic-native/splash-screen/ngx';
import { StatusBar } from '@ionic-native/status-bar/ngx';
import { ScreenOrientation } from '@ionic-native/screen-orientation/ngx';
@Component({
selector: 'app-root',
templateUrl: 'app.component.html'
})
export class AppComponent {
constructor(
private platform: Platform,
private splashScreen: SplashScreen,
private statusBar: StatusBar,
private so: ScreenOrientation,
) {
this.initializeApp();
}
initializeApp() {
this.platform.ready().then(() => {
this.statusBar.styleDefault();
this.splashScreen.hide();
console.log('orientation is', this.so.type);
this.so.onChange().subscribe(() => {
console.log('orientation changed to ', this.so.type);
});
});
}
}
When I run my app – and this is a brand new ionic project with no other changes – I see this error in the logs:
ERROR TypeError: Invalid event target
at setupSubscription (fromEvent.js:50)
at Observable._subscribe (fromEvent.js:24)
at Observable.push../node_modules/rxjs/_esm5/internal/Observable.js.Observable._trySubscribe (Observable.js:43)
at Observable.push../node_modules/rxjs/_esm5/internal/Observable.js.Observable.subscribe (Observable.js:29)
at app.component.ts:28
at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (zone.js:391)
at Object.onInvoke (core.js:17299)
at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (zone.js:390)
at Zone.push../node_modules/zone.js/dist/zone.js.Zone.run (zone.js:150)
at zone.js:889
defaultErrorLogger @ core.js:15724
Does anyone know what this means and how to fix it? My subscriptions to the onChange events do not work, so I’m not getting the orientation changes.
(This is Ionic 4.)
Floating Action Button as Input type="file"
nope… reading documentation, it says
Supported platforms
- Android
Ion-content fixed + content scrollable?
Hello,
how can i render ion-content fixed while being scrollable inside?
Do you have example code ?
Thank you
My ionic app suddenly stuck on splash screen before it was running
check this cmd
ionic cordova run android --prod --device (if you want to run it on your mobile device using USB cable)
or
ionic cordova build android --prod (if you want to create a apk from it and install it manually)
Ionic 4 - How to check current page is on root or not?
I have tried to implement ion-nav but i have got message like this
Cannot read property ‘canGoBack’ of null from ionNav
Ion-content fixed + content scrollable?
can you send your code ???
Build Break with aapt error message . why?
After 5 days I could solve my problem. Thank you so much!
Dynamic pages in ionic 3
on click on button can i create new page automatically in ionic 3
or
automatic tab in ionic 3
please help team
Can not delete googleplus ionic 4
For whoever still has this problem, cordova platform rm platform browser if you still have it
Ionic 3 with Notch Screen for Android
@Uzziel306 and @sumodevelopment do you find the solution please tell me if you find the solution.
Ionic 4 -¿Is there a way to observe all alerts dismisses not having to control all of them individualy?
Hi there!
I’m trying to find out if there is a way to observe or if an event is fired for all the alerts and loading dismisses in a page, where i have to setFocus() on an input where a scanner have to write.
The thing is that I have a async service function that provides me info about the product code scanned, and this one have a loading that cancel the myAlert.onDidDismiss().then(() => { this.myInput.setFocus() }).
const editAlert = await this.alertController.create({
header: 'Editando Packs de:',
message: `<p>` + itemToEdit.sscc + `</p>
<p>` + itemToEdit.layout + `</p>`,
inputs: [
{
name: 'packs',
type: 'number',
value: itemToEdit.packs,
placeholder: 'Nº de Packs'
}
],
buttons: [
{
text: 'Volver',
role: 'cancel',
cssClass: 'secondary',
handler: () => {
option.close();
this.ssccInput.setFocus();
}
},
{
text: 'Confirmar',
handler: async data => {
if (itemToEdit.packs !== data.packs) {
if (data.packs > originalProduction[0].packs) {
await this.alertWithTimeoutAndSetFocusOnSSCC(
'Error',
'El número de packs especificado <strong>supera</strong> a los disponibles',
2000
);
} else {
let newNumberOfBottles = (data.packs * itemToEdit.bottles) / itemToEdit.packs;
let newWeightOfSSCC = Math.round(((itemToEdit.weight * newNumberOfBottles) / itemToEdit.bottles) * 10) / 10;
itemToEdit.bottles = newNumberOfBottles;
let oldWeightOfSSCC = itemToEdit.weight;
this.currentLoad -= oldWeightOfSSCC;
this.currentLoad += newWeightOfSSCC;
itemToEdit.weight = newWeightOfSSCC;
itemToEdit.packs = data.packs;
this.sqlServerServices.updateEditedTransaction(
this.newWaybillSleepId,
newNumberOfBottles,
data.packs,
newWeightOfSSCC,
itemToEdit.sscc
).then(() => {
option.close();
this.ssccInput.setFocus();
});
}
}
}
}
]
});
editAlert.present();
editAlert.onDidDismiss().then(() => {
this.ssccInput.setFocus();
});
I have also tryied what im used to use async await, but nothing changes.
itemToEdit.packs = data.packs;
await this.sqlServerServices.updateEditedTransaction(
this.newWaybillSleepId,
newNumberOfBottles,
data.packs,
newWeightOfSSCC,
itemToEdit.sscc
);
option.close();
this.ssccInput.setFocus();
}
}
}
}
]
});
editAlert.present();
editAlert.onDidDismiss().then(() => {
this.ssccInput.setFocus();
});
With and without the onDidDismiss at the end.
Change background-color of ion-content
//put it in your page.scss for what page you want
ion-content{
–ion-background-color:#000;
}
Ion-content fixed + content scrollable?
Hello this is my code:
<ion-header>
<ion-toolbar>
<ion-title>
Ionic Blank
</ion-title>
</ion-toolbar>
</ion-header>
<ion-content>
<div>
<p>
Lorem ipsum dolor, sit amet consectetur adipisicing elit.
Aliquam amet nostrum dolorem voluptatibus animi explicabo,
pariatur quaerat eligendi minima fugit quam similique dolores commodi laborum unde non.
Facilis, laboriosam reiciendis.
</p>
<p>
Lorem ipsum dolor, sit amet consectetur adipisicing elit.
Aliquam amet nostrum dolorem voluptatibus animi explicabo,
pariatur quaerat eligendi minima fugit quam similique dolores commodi laborum unde non.
Facilis, laboriosam reiciendis.
</p>
<p>
Lorem ipsum dolor, sit amet consectetur adipisicing elit.
Aliquam amet nostrum dolorem voluptatibus animi explicabo,
pariatur quaerat eligendi minima fugit quam similique dolores commodi laborum unde non.
Facilis, laboriosam reiciendis.
</p>
<p>
Lorem ipsum dolor, sit amet consectetur adipisicing elit.
Aliquam amet nostrum dolorem voluptatibus animi explicabo,
pariatur quaerat eligendi minima fugit quam similique dolores commodi laborum unde non.
Facilis, laboriosam reiciendis.
</p>
<p>
Lorem ipsum dolor, sit amet consectetur adipisicing elit.
Aliquam amet nostrum dolorem voluptatibus animi explicabo,
pariatur quaerat eligendi minima fugit quam similique dolores commodi laborum unde non.
Facilis, laboriosam reiciendis.
</p>
<p>
Lorem ipsum dolor, sit amet consectetur adipisicing elit.
Aliquam amet nostrum dolorem voluptatibus animi explicabo,
pariatur quaerat eligendi minima fugit quam similique dolores commodi laborum unde non.
Facilis, laboriosam reiciendis.
</p>
<p>
Lorem ipsum dolor, sit amet consectetur adipisicing elit.
Aliquam amet nostrum dolorem voluptatibus animi explicabo,
pariatur quaerat eligendi minima fugit quam similique dolores commodi laborum unde non.
Facilis, laboriosam reiciendis.
</p>
<p>
Lorem ipsum dolor, sit amet consectetur adipisicing elit.
Aliquam amet nostrum dolorem voluptatibus animi explicabo,
pariatur quaerat eligendi minima fugit quam similique dolores commodi laborum unde non.
Facilis, laboriosam reiciendis.
</p>
<p>
Lorem ipsum dolor, sit amet consectetur adipisicing elit.
Aliquam amet nostrum dolorem voluptatibus animi explicabo,
pariatur quaerat eligendi minima fugit quam similique dolores commodi laborum unde non.
Facilis, laboriosam reiciendis.
</p>
<p>
Lorem ipsum dolor, sit amet consectetur adipisicing elit.
Aliquam amet nostrum dolorem voluptatibus animi explicabo,
pariatur quaerat eligendi minima fugit quam similique dolores commodi laborum unde non.
Facilis, laboriosam reiciendis.
</p>
<p>
Lorem ipsum dolor, sit amet consectetur adipisicing elit.
Aliquam amet nostrum dolorem voluptatibus animi explicabo,
pariatur quaerat eligendi minima fugit quam similique dolores commodi laborum unde non.
Facilis, laboriosam reiciendis.
</p>
<p>
Lorem ipsum dolor, sit amet consectetur adipisicing elit.
Aliquam amet nostrum dolorem voluptatibus animi explicabo,
pariatur quaerat eligendi minima fugit quam similique dolores commodi laborum unde non.
Facilis, laboriosam reiciendis.
</p>
</div>
</ion-content>
my ionic info:
Ionic:
ionic (Ionic CLI) : 4.12.0
System:
NodeJS : v11.10.0
npm : 6.9.0
OS : macOS Mojave
Maybe this problem only on my current ionic version…