@tokuhara wrote:
Is there any alternative for ion-slides?
In ionic 3 the ion-slides do not work well with ngFor and in v4 it do not have all the effects (fade, cube…).
I have tried to use swiper but it doesn’t work, I think there are some conflicts with ion-slides and the swiper library.
Really in need for slides with fade, autoplay and loop.
Posts: 1
Participants: 1
@franzisk4sis wrote:
Hey guys,
I noticed that when I load a “page” on the tabs it goes very fast but when I load from a left menu it takes some seconds to load, it seems that it reloads everything every time.
On the left menu I have something like:
<ion-item [href]="link.url" [class.active-item]="link.active" routerDirection="root"> <fa-icon [icon]="link.icon" slot="start"></fa-icon> <ion-label>{{link.title}}</ion-label> </ion-item>I made a video running the app on a real device.
Video ExampleAm I doing anything wrong on the left menu?
Posts: 1
Participants: 1
@YanisForley wrote:
(Sorry for my English)
Hi everyone.
I request you for a big problem.
I have a very specific need because I have to be able to load and unload several stencil projects.
I can load projects with loadjs (https://github.com/muicss/loadjs) but i don’t know unload one of theses projects.
I need to unload one because it’s a differents version with same components name, and only the first loaded component is taken about account.
Example :
v1> project-button> /v1>
v2> project-button> /v2>v1 and v2 are differents projects but the button have the same and use the button of v1.
In the better case, i hope to unload project 1 before load project 2
Do you have a solution for me ?
Posts: 1
Participants: 1
@sdhupe19 wrote:
My code is
<button ion-button icon-left block (click)=“signInWithGoogle()”>
{{“Log in with Google” | translate}}
import { TranslateService,} from ‘@ngx-translate/core’;
constructor{// delarations here//}
this.lang = ‘en’;
this.translate.setDefaultLang(‘en’);
this.translate.use(‘en’);switchLanguage() {
this.translate.use(this.lang);
}and I am getting an error as
Error: Template parse errors:
The pipe ‘translate’ could not be found ("
{{[ERROR ->]"Log in with Google" | translate}} </button>
Posts: 1
Participants: 1
@lunneyd wrote:
I have tabs and my map displays but I have to scroll to see the bottom of it and footer not showing. Any ideas how to avoid this. See the minus showed be showing without scrolling.
I have tabs too which is probably causing the issue. Any ideas how to fix.
Posts: 1
Participants: 1
@ElGerda wrote:
I am making my first app in ionic and i am pretty bad at coding etc.
How can i enter values from a database into an ion-select “combobox”?
Like i have in my database: Audi, BMW, Mercedes
And then i want to implement a combobox which is filled with those entrys.
Posts: 1
Participants: 1
@mlynch wrote:
I’m trying to create a table-like layout in Ionic v4 using
<ion-grid>code, and I’m looking for a way to make an<ion-col>element span two rows. Is this possible?
Posts: 1
Participants: 1
@Grouvie wrote:
I have a login function with different alerts and loaders.
I now upgraded to ionic 4 from ionic 3 and the alert and loader functions
don’t work like before. I tried to update my function, but I’m stuck at one point.My function is:
async signIn() { //// check to confirm the username and password fields are filled if (this.username.value == "") { let alert = await this.alertCtrl.create({ header: "ATTENTION", subHeader: "Username field is empty", buttons: ['OK'] }); return await alert.present(); } else if (this.password.value == "") { let alert = await this.alertCtrl.create({ header: "ATTENTION", subHeader: "Password field is empty", buttons: ['OK'] }); return await alert.present(); } else { var headers = new Headers(); headers.append("Accept", 'application/json'); headers.append('Content-Type', 'application/json'); let options = new RequestOptions({ headers: headers }); let data = { username: this.username.value, password: this.password.value }; let loader = await this.loading.create({ message: 'Processing please wait', }); return await loader.present().then(() => { //alerts stop working here, because they are not inside an async function //without the alerts the script works this.http.post('localhost/login.php', data, options) .pipe( map(res => res.json())) .subscribe(res => { console.log(res) loader.dismiss() if (res == "Your Login success") { let alert = await this.alertCtrl.create({ header: "CONGRATS", subHeader: (res), buttons: ['OK'] }); this.authService.login(); return await alert.present(); } else { let alert = await this.alertCtrl.create({ header: "ERROR", subHeader: "Your Login Username or Password is invalid", buttons: ['OK'] }); return await alert.present(); } }); }); } }I hope someone can help me to solve this problem and help me to change my function.
Thx a lot.
Posts: 1
Participants: 1
@Diesel555 wrote:
Has anyone received this error with google maps APIs (not Cordova) on iOS:
[Error] Google Maps JavaScript API error: UnauthorizedURLForClientIdMapError
https://developers.google.com/maps/documentation/javascript/error-messages#unauthorized-url-for-client-id-map-error
Your site URL to be authorized: capacitor://localhost/tabs/map
capacitorConsole (user-script:2:79)
Jc (js:54:134)
(anonymous function) (common.js:73:365)
(anonymous function) (common.js:139:167)
c (common.js:67:86)
Global Code (AuthenticationService.Authenticate:1)It just started randomly, which makes me wonder if other Ionic users are having this issue. It works fine in Android and on the web. I’m in touch with their support, it started on its own with no updates on my end.
Posts: 1
Participants: 1
@erodriguezAcisa wrote:
Hi!
I want to develop 3 frontends projects, a web for PC, a app for Android, and a app fot IOS, and the three have the same forms and the same fields. Can I develop a only project with the same code and get the three frontends with Ionic?
Regards
Posts: 1
Participants: 1
@Rudeblory wrote:
When trying to build an application for Android, the following error appears, how to fix it?
C:\Users\rudeb\Documents\Ionic Apps\Bochka>ionic cordova build android > ionic-app-scripts build --target cordova --platform android [19:53:33] ionic-app-scripts 3.2.2 [19:53:34] build dev started ... [19:53:34] clean started ... [19:53:34] clean finished in 29 ms [19:53:34] copy started ... [19:53:34] deeplinks started ... [19:53:34] deeplinks finished in 32 ms [19:53:34] transpile started ... [19:53:39] typescript: C:/Users/rudeb/Documents/Ionic Apps/Bochka/src/pages/page5/page5.ts, line: 5 Individual declarations in merged declaration 'Page5Page' must be all exported or all local. L4: import { Page6Page } from '../page6/page6'; L5: import { Page5Page } from '../page5/page5'; [19:53:39] typescript: C:/Users/rudeb/Documents/Ionic Apps/Bochka/src/pages/page5/page5.ts, line: 5 Import declaration conflicts with local declaration of 'Page5Page'. L4: import { Page6Page } from '../page6/page6'; L5: import { Page5Page } from '../page5/page5'; [19:53:39] typescript: C:/Users/rudeb/Documents/Ionic Apps/Bochka/src/pages/page5/page5.ts, line: 11 Individual declarations in merged declaration 'Page5Page' must be all exported or all local. L11: export class Page5Page { L12: // this tells the tabs component which Pages [19:53:39] typescript: C:/Users/rudeb/Documents/Ionic Apps/Bochka/src/pages/page6/page6.ts, line: 5 Individual declarations in merged declaration 'Page6Page' must be all exported or all local. L4: import { Page2Page } from '../page2/page2'; L5: import { Page6Page } from '../page6/page6'; [19:53:39] typescript: C:/Users/rudeb/Documents/Ionic Apps/Bochka/src/pages/page6/page6.ts, line: 5 Import declaration conflicts with local declaration of 'Page6Page'. L4: import { Page2Page } from '../page2/page2'; L5: import { Page6Page } from '../page6/page6'; [19:53:39] typescript: C:/Users/rudeb/Documents/Ionic Apps/Bochka/src/pages/page6/page6.ts, line: 11 Individual declarations in merged declaration 'Page6Page' must be all exported or all local. L11: export class Page6Page { L12: // this tells the tabs component which Pages [19:53:39] ionic-app-script task: "build" [19:53:39] Error: Failed to transpile program Error: Failed to transpile program at new BuildError (C:\Users\rudeb\Documents\Ionic Apps\Bochka\node_modules\@ionic\app-scripts\dist\util\errors.js:16:28) at C:\Users\rudeb\Documents\Ionic Apps\Bochka\node_modules\@ionic\app-scripts\dist\transpile.js:159:20 at new Promise (<anonymous>) at transpileWorker (C:\Users\rudeb\Documents\Ionic Apps\Bochka\node_modules\@ionic\app-scripts\dist\transpile.js:107:12) at Object.transpile (C:\Users\rudeb\Documents\Ionic Apps\Bochka\node_modules\@ionic\app-scripts\dist\transpile.js:64:12) at C:\Users\rudeb\Documents\Ionic Apps\Bochka\node_modules\@ionic\app-scripts\dist\build.js:109:82 [ERROR] An error occurred while running subprocess ionic-app-scripts. ionic-app-scripts build --target cordova --platform android exited with exit code 1. Re-running this command with the --verbose flag may provide more information.
Posts: 1
Participants: 1
@zuest wrote:
hello guys, i have a question, currently i was testing out ionic 4, on ios to be specific. im using a blank project and when i tried running the app i get multiple swift errors, i tried changing the swift version from 4.1 to 3.3 but with no use still the same error. am i missing something here?
im sorry if this question is redundant i couldn’t find anything useful for my case.
Thanks,
Posts: 1
Participants: 1
@fahd123 wrote:
Please how to pass data betwen pages (ionic 4) with this.router.navigateByUrl(‘page’);
Posts: 1
Participants: 1
@bengold wrote:
Getting an error with one of the plugins couldnt figure this out:
Error - Plugin error (you probably need to remove plugin files from your app): Fetching plugin “cordova-sqlite-storage@^2.5.1” via npm Installing “cordova-sqlite-storage” at “2.6.0” for ios Error during processing of action! Attempting to revert… Failed to install ‘cordova-sqlite-storage’: CordovaError: Uh oh! “/private/tmp/gimlet/3448644/project/cordova/plugins/cordova-sqlite-storage/node_modules/cordova-sqlite-storage-dependencies/sqlite3.c” not found! at copyFile
Posts: 1
Participants: 1
@HariNaTao wrote:
I have an Ionic 4 / Capacitor.js / Vue.js app and am trying to set a transparent header.
I’m using these versions
"@capacitor/android": "^1.0.0-beta.17", "@capacitor/cli": "^1.0.0-beta.17", "@capacitor/core": "^1.0.0-beta.17", "@capacitor/ios": "^1.0.0-beta.17", "@ionic/core": "^4.0.1", "@ionic/vue": "0.0.1",What happens is when I set the translucent prop on the
<ion-header>tag like this
<ion-header translucent="true" no-border>
save, then let it hot reload, the header shows up as transparent as I would expect. But navigating away and then back, or reloading the browser, and the header reappears.subsequent reloads and the header reappears as white
The component in question is below. If it helps, this component is inside an
<ion-tab>within an<ion-tabs>. I’ve also tried using the vue syntax of:translucent="true"to no avail. Also this behaviour is present in web browser and android emulator. I’ve tried everything in the documentation but the fact that it works pre-reload and then fails after leads me to believe there is a bug here. If not, has anyone an example of transparent headers working within vue? The solutions I have found are either angular related or extremely hacky for something that should be as simple as setting a prop<template> <div> <ion-header translucent="true" no-border> <ion-toolbar> <ion-buttons> <ion-back-button></ion-back-button> </ion-buttons> </ion-toolbar> </ion-header> <ion-content fullscreen text-center> <div class="content-secondary"> <ion-card color="light"> <ion-card-header> <ion-text class="card-title-top">YOUR</ion-text> <ion-text class="card-title-bottom">DASHBOARD</ion-text> </ion-card-header> <ion-card-content> <p style="">Welcome to your Stirfry Republic Member Dashboard!</p> <p style="">You currently have {{ formatRewardText }}</p> <Modal :item="rewards" modalComponent="rewards" > <ion-text slot="modalcontent" color="primary" style="">Rewards: Use unique codes to get discounts and free stuff.</ion-text> </Modal> <Modal :item="points" modalComponent="points"> <ion-text slot="modalcontent" color="primary" style="">Points: Get points for the dollars you spend on meals.</ion-text> </Modal> <ion-text>Everything here is fresh and prepared in-house (we do all our own software development), so if you find a bug, <a href="#" @click="share">send us an email</a>!</ion-text> </ion-card-content> </ion-card> </div> </ion-content> </div> </template> <style scoped> ion-content { --background: url('../assets/hero-bg-02-min.jpg') no-repeat center center / cover; } ion-toolbar { --background: transparent !important; --ion-color-base: transparent !important; } </style>
Posts: 1
Participants: 1
@safaAlshaarri wrote:
i have a project where i have folder for images the issue that i change the whole content of the image folder the issue is that when i do run android the new content disappear and the old content back again
how i can fix that
Posts: 1
Participants: 1
@RichardZhuang wrote:
I nearly finished my Ionic App Development and it works perfectly fine on my Android Emulator (Pixel 2 XL, Android API 27). But When I deploy it to my phone, it results in several problems.
There should be a parent-child relationship in my dishdetail and menu page - when clicking on the picture on menu page, the user will be redirected to the dishdetail page. But this “click-redirect” action doesn’t work on my device.
There is also an option that the user is able to add a specific dish into the favorite list. Then the favorite list is stored externally in the device. However, when I open the favorites page, a “TypeError: Cannot Read Property ‘some’ of null” occurs and no data is loaded.
I suspect that the problem may lie in that the app is not able to get the storage on the device, so I deploy android-permissions to aid me with this. But it still doesn’t seem to work.
Below is my favorite.ts provider (the problem can only in the “this.favorites.some” part, right?).
imports... @Injectable() export class FavoriteProvider { favorites: Array<any>; constructor(public http: Http, private dishservice: DishProvider, private storage: Storage, private localNotifications: LocalNotifications) { console.log('Hello FavoriteProvider Provider'); this.favorites = []; this.storage.get('favorites').then( favor => this.favorites = favor ); } addFavorite(id: number): boolean { if (!this.isFavorite(id)) this.favorites.push(id); console.log('favorites', this.favorites); this.storage.set('favorites', this.favorites); this.localNotifications.schedule({ id: id, text: 'Dish ' + id + ' added as a favorite successfully', }); return true; } isFavorite(id: number): boolean { return this.favorites.some(el => el === id); } getFavorites(): Observable<Dish[]> { return this.dishservice.getDishes() .map(dishes => dishes.filter(dish => this.favorites.some(el => el === dish.id))); } deleteFavorite(id: number): Observable<Dish[]> { let index = this.favorites.indexOf(id); if (index >= 0) { this.favorites.splice(index, 1); this.storage.set('favorites', this.favorites); return this.getFavorites(); } else { console.log('Deleting non-existant favorite', id); return Observable.throw('Deleting non-existant favorite' + id); } } }Ionic:
ionic (Ionic CLI) : 4.10.2 (C:\Users<Username>\AppData\Roaming\npm\node_modules\ionic)
Ionic Framework : ionic-angular 3.9.2
@ionic/app-scripts : 3.2.2Cordova:
cordova (Cordova CLI) : 8.1.2 (cordova-lib@8.1.1)
Cordova Platforms : android 7.1.4
Cordova Plugins : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 3.1.2, (and 11 other plugins)System:
NodeJS : v10.14.1 (C:\Program Files\nodejs\node.exe)
npm : 6.4.1
OS : Windows 10Please let me know if you need any further information.
Posts: 1
Participants: 1
@monkeytronics wrote:
Hi all,
Here’s a tiny piece of code:
<div id="canvas-div-gauge" style=" margin: none; height:40vh"> <ion-row > <ion-col size="5"> <canvas id="chart-temp-gauge" style="width:43vw"></canvas> </ion-col> <ion-col size="5"> <canvas id="chart-hum-gauge" style="width:43vw"></canvas> </ion-col> </ion-row> </div>Now, I’ve tried this with and without the width,and with and without useing the size (since default should be 2 equal columns). What i see is that the contents don’t go into columns. They end up above one another! Until I use a larger device (either my browser or choosing an ipad X from the emulator. Then they work. How can I use the ionic grid to give me what I want. I.e. the two canvas elements on the same line. Obvously they may need to be smaller to achieve this.
Posts: 1
Participants: 1
@silvairsoares wrote:
I am using the command:
ionic generate component accordion-list
Then the following directory structure is created automatically:
components
-accordion-list
–accordion-list.html
–accordion-list.scss
–accordion-list.ts
components.moduleSo I’m trying to make a hello world with my custom component on any html page, like this:
It already includes and excludes entries for my custom component in the files: “app \ app.component.ts” and “app \ app.module.ts”.
However, I still get the following error on the console:
-------------------- Error --------------------
ERROR Error: Uncaught (in promise): Error:
Template parse errors:
‘accordion-list’ is not a known element:
If ‘accordion-list’ is an Angular component, then verify that it is part of this module.
If ‘accordion-list’ is a Web Component then add ‘CUSTOM_ELEMENTS_SCHEMA’ to the ‘@NgModule.schemas’ of this component to suppress this message. ("
[ERROR ->]
-------------------- Error ------------------------------------ My Environment --------------------
Angular CLI: 7.3.2
Node: 8.11.2
OS: win32 x64
Angular: 5.2.10
… animations, common, compiler, compiler-cli, core, forms
… http, platform-browser, platform-browser-dynamicPackage Version
@angular-devkit/architect 0.13.2 (cli-only)
@angular-devkit/build-optimizer 0.0.35
@angular-devkit/cor 7.3.2 (cli-only)
@angular-devkit/schematics 7.3.2 (cli-only)
@schematics/angular 7.3.2 (cli-only)
@schematics/update 0.13.2 (cli-only)
rxjs 5.5.11
typescript 2.6.2
webpack 3.8.1Ionic 4.10.3
---------------- My Environment ------------------------------------- My questions --------------------
What are the correct locations for referencing my custom components?
Sorry for the outburst. But for what reason the command “ionic generate component …” does not make the necessary entries. Would not it be more intuitive?
----------------- My questions --------------------
Posts: 1
Participants: 1
