Thanks for pointing out. In my opinion, if it is too buggy and poor supported, than it should be removed from the ionic page:
I’m new to ionic and capacitor. How should I know this kind of things?
Thanks for pointing out. In my opinion, if it is too buggy and poor supported, than it should be removed from the ionic page:
I’m new to ionic and capacitor. How should I know this kind of things?
Hello,
I’m using the ionic printer plugin in a project and it seems to be working in the browser, but not on IOS devices.
When I close the printer modal (either by pressing close/printing) and go to a different view, some elements on that view are hidden
What I’ve noticed though, is if I manually remove and then add the .hydrated
class on the html
tag, everything goes back to normal.
Is there anything I’m missing? A reload/rehydrate method?
Any help will be much appreciated
I found this Plugin, after tested around 3 Plugins which doesn’t work. Because i work in a big company, i stopped searching for a free one then and we bought it.
Hi,
however, if I don’t put my Provider in the providers section I can use the provider in this way:
import { WsmanagerService } from 'src/app/services/wsmanager.service';
export class ItemDetailPage implements OnInit {
constructor(
...
private translate: TranslateService,
private settingsManager: SettingsmanagerService,
private wsManager: WsmanagerService,**
) {}
...
}
So what changes if I put it in the providers section?
cld
Hi,
I’d like to use Firebase FCM in an Ionic4 app.
I’ve seen that a common way to do this is to use the @angular/fire library.
I have installed it in this way:
npm install @angular/fire firebase --save
But, when I start the app, I have this error:
[ng] ERROR in node_modules/@angular/fire/angularfire2.d.ts(37,49): error TS2344: Type 'T[K]' does not satisfy the constraint '(...args: any[]) => any'.
[ng] node_modules/@angular/fire/angularfire2.d.ts(40,49): error TS2344: Type 'T[K]' does not satisfy the constraint '(...args: any[]) => any'.
[ng] node_modules/@angular/fire/angularfire2.d.ts(48,78): error TS2344: Type 'T[K]' does not satisfy the constraint '(...args: any[]) => any'.
[ng] node_modules/@angular/fire/angularfire2.d.ts(48,107): error TS2344: Type 'T[K]' does not satisfy the constraint '(...args: any[]) => any'.
[ng] node_modules/@angular/fire/angularfire2.d.ts(50,75): error TS2344: Type 'T[K]' does not satisfy the constraint '(...args: any[]) => any'.
[ng] node_modules/@angular/fire/angularfire2.d.ts(50,96): error TS2344: Type 'T[K]' does not satisfy the constraint '(...args: any[]) => any'.
[ng] src/app/app.module.ts(63,26): error TS2307: Cannot find module '@ionic-native/firebase/ngx'.
[ng] src/app/services/fcmmanager.service.ts(2,26): error TS2307: Cannot find module '@ionic-native/firebase/ngx'.
[ng]
I can see that in the package.json file I have:
+ "@angular/fire": "^6.0.0",
+ "firebase": "^7.14.2",
Have you ever used this library?
What version of @angular/fire and firebase are you using and are compatible with Ionic4?
Thank you very much
Claudio
Hi, iam working on App, which uses bluetooth printer to print bills. To get bill printed with correct diacritics, i need to encode it to correct coddepage. This can be done with this iconv-lite library, but iam not able to get it work.
I succesfully installed it, imported it in my printerService and try to run ionic serve, i get the following error:
core.js:6014 ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'isEncoding' of undefined
TypeError: Cannot read property 'isEncoding' of undefined
at Object../node_modules/string_decoder/lib/string_decoder.js (string_decoder.js:29)
at __webpack_require__ (bootstrap:84)
at Object../node_modules/iconv-lite/encodings/internal.js (internal.js:49)
at __webpack_require__ (bootstrap:84)
at Object../node_modules/iconv-lite/encodings/index.js (index.js:6)
at __webpack_require__ (bootstrap:84)
at Object.getCodec (index.js:65)
at Object.getEncoder (index.js:117)
at Object.encode (index.js:22)
at PrintService.testEncode (print.service.ts:26)
at resolvePromise (zone-evergreen.js:797)
at zone-evergreen.js:862
at ZoneDelegate.invokeTask (zone-evergreen.js:391)
at Object.onInvokeTask (core.js:39680)
at ZoneDelegate.invokeTask (zone-evergreen.js:390)
at Zone.runTask (zone-evergreen.js:168)
at drainMicroTaskQueue (zone-evergreen.js:559)
at ZoneTask.invokeTask [as invoke] (zone-evergreen.js:469)
at invokeTask (zone-evergreen.js:1603)
at HTMLElement.globalZoneAwareCallback (zone-evergreen.js:1629)
When i tried to run it on device, i get this error when i try to enter page, to which is printService injected -
ERROR Error: Uncaught (in promise): Error: Runtime compiler is not loaded
Error: Runtime compiler is not loaded
I get same errors even when i tried to use this ESC POS ionic library - https://github.com/Ans0n-Ti0/EscPosEncoder(with difference, that the error when i run ionic serve says “Unknown Codepage” even if iam entering correct codepage like cp852)
Any ideas how to solve this? iam using ionic 5 and angular 8.
Yes, I want update the countProject
. I think in the service getCount
I need a subscribe to get the countProject
, but I don´t know how.
When I get back the parameter term
from the ngModel of my searchbar, I want to update the countProject
and share the new countProject
to other components.
Do you know what I meen?
I have upgraded an Ionic 3 app to Ionic 5 and almost ready to go live with it but I have noticed that certain things are very slow when running on Android such as the initial loading of icons.
I have connected the Android device (Samsung Galaxy S8) to Chrome dev tools and I can see that certain JS and SVG files are taking 5 seconds to load the first time. These files should be local to the device so why is this taking so long?
These problems do not appear to happen on iOS (iPhone 11 Pro) although it is a newer and faster device so maybe it is just not noticable. Screenshots below showing the files that are taking a long time.
on a Subject you can call next()
to emit any Value that every Component that is subscribed to this subject will receive
In this file:
ConnectPlugin.java
Look for this line (appears like three times)
LoginManager.getInstance().logInWithReadPermissions(cordova.getActivity(), permissions);
before this lines I added (in all)
LoginManager.getInstance().setLoginBehavior(LoginBehavior.WEB_ONLY);
This is the file path: plugins\cordova-plugin-facebook4\src\android
i think its alright , but it should be outlined on the first page which you open on ionicframework.com
before this i solely wrote firefox addons in pure javascript (the good old addons which could modify the browser itsself) , also kind of apps if wanna call them that , giving data from one page to the next in the options was always alot of work … here in ionic/angular i can just use a single service with a simple object which holds my data across different pages and forms , i think its very nice , the index of everything always stays the same , no remembering of indexes or anything like that …
Is it possible to access the @ionic/storage driver from the global window object? I’m trying out cypress io for e2e testing, and it would be a convenient means to automate login to directly read write to indexeddb without having to re-implement the basics of connecting to the right database, dealing with transactions, and so forth.
I believe I’ve come up with a solution to this on my own. In my Cypress.io spec, I can just do the following:
// globals in the file
const Storage = require('@ionic/storage').Storage;
const storage = new Storage();
… and at that point it seems like storage
is available in my tests just as though it had been injected into an Angular class.
I want to post multipart form data, for this, we can do like this:
let formData = new FormData()
formData.append('myfile', 'your blob')
this.http.post(url, formData)
But I don’t know how to convert a camera image to the blob. I am using native camera plugin and here my code:
cameraOptions: CameraOptions = {
quality: 20,
destinationType: this.camera.DestinationType.DATA_URL,
encodingType: this.camera.EncodingType.JPEG,
mediaType: this.camera.MediaType.PICTURE,
sourceType: this.camera.PictureSourceType.PHOTOLIBRARY
}
constructor(public camera: Camera){}
takePhoto() {
return new Promise(resolve => {
this.camera.getPicture(this.cameraOptions).then((imageData) => {
resolve(imageData);
}, (err) => {
resolve(err);
});
});
}
I tried this code for blob:
dataURLtoBlob(dataURL) {
debugger;
// convert base64/URLEncoded data component to raw binary data held in a string
let byteString: string;
if (dataURL.split(',')[0].indexOf('base64') >= 0) {
byteString = atob(dataURL.split(',')[1]);
} else {
byteString = unescape(dataURL.split(',')[1]);
}
// separate out the mime component
let mimeString = dataURL
.split(',')[0]
.split(':')[1]
.split(';')[0];
// write the bytes of the string to a typed array
let ia = new Uint8Array(byteString.length);
for (let i = 0; i < byteString.length; i++) {
ia[i] = byteString.charCodeAt(i);
}
let blobImg = new Blob([ia], { type: mimeString });
console.log(blobImg);
this.blobImage = blobImg;
}
With this code, I am able to get image data but how to convert in a blob,
please help…
Same problem here it looks like it’s a ionic CLI issue.
Here they suggest to update the CLI to the latest version: https://github.com/ionic-team/ionic/issues/20908
Hi all,
I’m new at Ionic framework. I would like to create an app that auto-configure CalDAV (or EAS) calendar and IMAP account (maybe using default system app, i need only to add the system account by passing some parameters). Is it possible?
Thanks in advance.
I experience the same problem on my Mac running the latest CLI
Hi did you try on both Android and iOS? Does it receive notifications?
cld
which ionic version you using?
Hi. I’m a newbie on Ionic and Angular, i’m struggling try to show content in ion-list after syncronize from an API.
The first nothing appears but if i refresh the browser the data appears as it should do. Can someone explain me the reason why this happens?
Code:
news.service.ts
import { Injectable } from ‘@angular/core’;
import { Dexie } from ‘dexie’;
import { DexieService } from ‘./dexie.service’;
import { Observable, from } from ‘rxjs’;export interface News {
id: number;
creation_date: string;
thumbnail: string;
thumbnail_type: string;
title: string;
subtitle: string;
corpus: string;
visibility: string;
active: string;
}@Injectable()
export class NewsService {
newsTable: Dexie.Table<News, number>;constructor(private dexieService: DexieService) {
this.newsTable = this.dexieService.table(‘news’);
}getAllNews(): Observable<News> {
return from(this.newsTable.where(‘active’).equals(‘1’).reverse().sortBy(‘creation_date’));
}getAllFeaturedNews(): Observable<News> {
return from(this.newsTable.where(’[featured+active]’).equals([“1”, “1”]).reverse().sortBy(‘creation_date’));
}getNewContent(newId: number): Promise<News> {
return this.newsTable.where(’[id+active]’).equals([newId, “1”]).toArray();
}
}
main.page.ts:
import { Component, ViewChild, OnInit, ChangeDetectorRef } from ‘@angular/core’;
import { ActivatedRoute, Router } from ‘@angular/router’;
import { DomSanitizer, SafeHtml } from ‘@angular/platform-browser’;
import { IonSlides } from ‘@ionic/angular’;
import { StructureService, Structure } from ‘…/…/services/structure.service’;
import { NewsService, News } from ‘…/…/services/news.service’;
import {
Plugins } from ‘@capacitor/core’;
const { App } = Plugins;
@Component({
selector: ‘app-main’,
templateUrl: ‘./main.page.html’,
styleUrls: [’./main.page.scss’]
})
export class MainPage implements OnInit {
@ViewChild(‘slides’, { static: false }) slider: IonSlides;
public news: News;
public newsLength = 0;
public newsFeatured: News;
public newsFeaturedLength = 0;
constructor(
private newsService: NewsService,
private ref: ChangeDetectorRef
) {
this.news = ;
this.newsFeatured = ;
this.getNews();
}
getNews(){
this.newsService.getAllNews().subscribe(data => {
this.news = data;
this.newsLength = this.news.length;
console.log(this.news);
this.ref.detectChanges();
},
error => {
// what you want to do with the error
console.log(error);
});
this.newsService.getAllFeaturedNews().subscribe(data => {
this.newsFeatured = data;
this.newsFeaturedLength = this.newsFeatured.length;
console.log(this.newsFeatured);
//console.log(this.newsFeatured.length);
this.ref.detectChanges();
},
error => {
// what you want to do with the error
console.log(error);
});
}
}
main.page.html:
<ion-slides #slides (ionSlideDidChange)=“slideChanged()” [options]=“sliderOptions”>
<ng-container *ngIf=“newsFeatured.length == 0;”>
<ion-img [src]=“spinnerRotate” style=“margin-top: 60%;” class=“spinnerRotation center”>
<ng-container *ngIf=“newsFeatured.length > 0;”>
<ng-container *ngFor=“let newl of newsFeatured”>
<ion-card *ngIf="(newl.visibility == ‘public’ || (newl.visibility == ‘private’ && logged))" (click)=“getNew(newl.id, 1)” [ngStyle]="{‘background-image’: ‘url(data:’ + newl.thumbnail_type + ‘;base64,’ + newl.thumbnail + ‘)’, ‘background-size’:‘cover’}"
class=“card-image”>
Thanks in advance