Quantcast
Channel: Ionic Framework - Ionic Forum
Viewing all 49526 articles
Browse latest View live
↧

Android Studio not recognizing changes

March 23, 2020, 4:46 am
$
0
0

@Vigors wrote:

Hi,
For some reason, when I make a change to my code, and then build it: ionic build, ionic capacitor copy, the change is not picked up in the Android Studio. When I run the app, some old version of the code is ran on the app.

I am really stuck on this, any help would be appreciated.

Ionic:

Ionic CLI : 5.4.16 (C:\Users\craig\AppData\Roaming\npm\node_modules\ionic)
Ionic Framework : @ionic/angular 5.0.5
@angular-devkit/build-angular : 0.900.6
@angular-devkit/schematics : 9.0.6
@angular/cli : 9.0.6
@ionic/angular-toolkit : 2.2.0

Capacitor:

Capacitor CLI : 1.5.1
@capacitor/core : 1.5.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 : 0.10.0
native-run : 0.3.0

System:

NodeJS : v12.15.0 (C:\Program Files\nodejs\node.exe)
npm : 6.13.4
OS : Windows 10

Posts: 1

Participants: 1

Read full topic

↧
Search

Ionic date picker and calling calendar view

March 23, 2020, 5:15 am
↧
↧

--release causes a very large App Size

March 23, 2020, 5:30 am
$
0
0

@EinfachHans wrote:

When i build my App with:

ionic cordova build ios --debug --buildConfig is has a File Size of nearly 50mb.

But with

ionic cordova build ios --prod --release --buildConfig the Size of the distribution Archive is over 100mb.

Any Ideas?

I tried:

  • Remove Platform
  • Remove Node_modules
  • Remove Plugins
  • Remove www Folder
  • Reinstall and Rebuild everything

Posts: 1

Participants: 1

Read full topic

↧

How to get your current location in real-time using geolocation?

March 23, 2020, 5:34 am
$
0
0

@Sweg wrote:

I am getting my current location using Geolocation below:

ngAfterViewInit(): void {
    this.getLoc().then((resp) => {
      this.initMap(resp.coords.latitude, resp.coords.longitude);
    }, er => {
      alert('Cannot retrieve Location')
    });
  }

getLoc() {
    return this.geolocation.getCurrentPosition(
      {
        maximumAge: 1000, timeout: 5000,
        enableHighAccuracy: true
      });
  }

The above code retrieves my current location when I open up the app.

But now when the user has the app open, I want their location to be updated in realtime.

I.e. If I have the app open, & start walking, I want my longitude & latitude values to be updated on the map I’m initiating in ngAfterViewInit().

Can someone please tell me what changes I need to make to add this functionality?

Posts: 1

Participants: 1

Read full topic

↧

Circular dependency with modals

March 23, 2020, 7:45 am
$
0
0

@chager wrote:

Hi all. I’m trying to build a ModalPage to create a Contact. This Contact has a List of related Contacts wich can be created from inside the Modal. As soon as I try to Open the Modal from inside the Modal I get a “Circular dependency detected”. Does anyone know how I can prevent this?

Posts: 2

Participants: 2

Read full topic

↧
↧

Ionic Router without Frameworks

March 23, 2020, 8:05 am
$
0
0

@ArasBerke wrote:

Hello! I am using Ionic without any Framework. How can I use the router? In the Docs there is this:

    customElements.define('nav-home', class NavHome extends HTMLElement {
      connectedCallback() {
        this.innerHTML = `
          ... HTML CODE HERE ...
        `;
      }
    });

How can I split it into files? I tried using:

customElements.define('nav-home', class NavHome extends HTMLElement {
      connectedCallback() {
        $(this).load('myfile.html');
      }
    });

with jQuery, but It is not a good idea. What do you use? Thanks!

Posts: 1

Participants: 1

Read full topic

↧

How to place an ion-label underneath an ion-fab-button?

March 23, 2020, 8:11 am
$
0
0

@Sweg wrote:

Is it possible to have an ion-label placed just underneath an ion-fab-button?

At the moment, it is appearing like this:

home

But I want it to display like so:

home1

Here is my current HTML & CSS:

<ion-fab class="ion-fab">
        <ion-fab-button color="light">
          <ion-label class="ion-text-wrap">HOME</ion-label>
            <ion-icon name="home-outline" color="primary"></ion-icon>
        </ion-fab-button>
</ion-fab>

.ion-fab {
  bottom: 20px;
  z-index: 400;
  width: 100%;
  display: flex;
  justify-content: space-around;
}

Posts: 1

Participants: 1

Read full topic

↧

How to show loading spinner while fetching data ionic 4

March 23, 2020, 8:40 am
$
0
0

@tkhang wrote:

I want to fetch data when I displaying the loading spinner, and after duration, the spinner gone and user will see data. Please help me :smiley: In ionic 4 using loading controller

Posts: 1

Participants: 1

Read full topic

↧
Search

Ionic v4 livereload on Android emulator not working

March 23, 2020, 10:02 am
$
0
0

@obinnae wrote:

I want to test my Ionic 4 app on the Android emulator with live-reload, but when I run it, the emulator just shows a white screen and the chrome debug screen doesn’t print anything. If I run it without --livereload, it works fine, though I won’t be able to debug it. It also works fine (with --livereload) if testing on a device via USB.

Any idea why, or how I can get it to work on the emulator?

Thanks.

Posts: 1

Participants: 1

Read full topic

↧
↧

Cordova-plugin-firebasex under iOS do not rigger callbacks

March 23, 2020, 10:06 am
$
0
0

@fascox wrote:

Firebase Cloud Message notification work quite well under Android.
But in iOS notifications definitely arrive as verified in the Xcode console but callbacks like onMessageReceived() or with getToken() never get triggered.

Anyone with this issue?

Ionic:

Ionic CLI : 6.3.0 (/usr/local/lib/node_modules/@ionic/cli)
Ionic Framework : @ionic/angular 5.0.5
@angular-devkit/build-angular : 0.900.4
@angular-devkit/schematics : 9.0.4
@angular/cli : 9.0.4
@ionic/angular-toolkit : 2.2.0

Cordova:

Cordova CLI : 9.0.0 (cordova-lib@9.0.1)
Cordova Platforms : android 8.1.0, ios 5.1.1
Cordova Plugins : cordova-plugin-ionic-keyboard 2.2.0, cordova-plugin-ionic-webview 4.1.3, (and 10 other plugins)

Utility:

cordova-res (update available: 0.10.0) : 0.9.0
native-run : 0.3.0

System:

Android SDK Tools : 26.1.1 (/Users/fascox/Library/Android/sdk)
ios-deploy : 1.10.0
ios-sim : 8.0.2
NodeJS : v13.8.0 (/usr/local/Cellar/node/13.8.0/bin/node)
npm : 6.14.3
OS : macOS Catalina
Xcode : Xcode 11.3.1 Build version 11C504

Posts: 1

Participants: 1

Read full topic

↧

Fab toggleList() not exist in V5?

March 23, 2020, 10:11 am
$
0
0

@LHLK wrote:

Good day. Updating from V4 to V5 but encouter issues and don’t know how to solve it.

In V4 following works:
import { IonFabList } from ‘@ionic/angular’;
@ViewChild(‘fab’,{static: false}) fab: IonFabList;

then I can call this.fab.toggleList(); (Open the list fab buttons)

But in V5 toggleList() no longer associated with IonFabList ?

I tried with IonFab but no luck. Would you please advice how to call the toggleList() method in ion-fab component?

Envirnoment:
Ionic:

Ionic CLI : 6.3.0
Ionic Framework : @ionic/angular 5.0.5
@angular-devkit/build-angular : 0.803.25
@angular-devkit/schematics : 8.3.25
@angular/cli : 8.3.25
@ionic/angular-toolkit : 2.2.0

Utility:
cordova-res : 0.10.0
native-run : 0.3.0
System:
Android SDK Tools : 26.1.1
NodeJS : v12.14.0 (D:\Program Files\nodejs\node.exe)
npm : 6.13.4
OS : Windows 10

Thanks…

Posts: 1

Participants: 1

Read full topic

↧

Equivalent path to http://localhost:8100/assets/ for ionic android

March 23, 2020, 11:56 am
$
0
0

@arunRaj1986 wrote:

Hello code lovers,

I have problem on my web app ( ionic 4, angular 6 and cordova 9).

I have to open a PDF file which located in src/assets folder,
while running locally filePath = 'http://localhost:8100/assets/ is working fine, but on android build it’s failed to locate assets path.

on opening of app , it shows
Application Error
The connection to the server was unsuccessful.
(file:///android_asset/www/index.html)

I know app does not run on localhost:port/

waiting for solution.

Posts: 1

Participants: 1

Read full topic

↧

How works with react ionic native elements

March 23, 2020, 12:19 pm
$
0
0

@jhoncbernal wrote:

I had problems with react in ionic to use de File transfer someone can help me?

import { FileTransfer, FileUploadOptions, FileTransferObject } from ‘@ionic-native/file-transfer’;
export class FileFormPage extends React.Component<{},
{ http:HTTP,
file: any,
showToast1: boolean,
loginMessage: string,
hiddenbar: boolean,
}> {
constructor(props: any,private http: HTTP,private transfer: FileTransfer) {
super(props);
this.state = {
http:http,
file: ‘’,
showToast1: false,
loginMessage: ‘’,
hiddenbar: true,
}
}
async handleSubmit(e: FormEvent) {
e.preventDefault();
try {
const fileTransfer: FileTransferObject = this.transfer.create(); “Cannot read property ‘create’ of undefined”
or if i change the import

TypeScript error in /Users/jhoncasallas/Documents/OwnCode/VecinoIonic/src/components/FileForm.tsx(22,69):
Cannot find module ‘@ionic-native/file-transfer/ngx’. TS2307
20 | import { execFile } from ‘child_process’;
21 | import { File } from ‘@ionic-native/file’;

22 | import { FileTransfer, FileUploadOptions, FileTransferObject } from ‘@ionic-native/file-transfer/ngx’

Posts: 1

Participants: 1

Read full topic

↧
↧

How to use mode="ios" for a single component in Ionic 5?

March 23, 2020, 12:26 pm
$
0
0

@j-carignan wrote:

Hello, I want to use ion-router-outlet with mode=“ios” to have the horizontal page transition. It worked well in Ionic 4 but now in Ionic 5, the mode is applied to every children of ion-router-outlet which means all my components get shown in a ios style, even on Android or Web.

How can use the mode attribute like it was on Ionic 4, for the current component only?

Thanks

Posts: 1

Participants: 1

Read full topic

↧

Auth Persistence using Ionic/Vue and Firebase

March 23, 2020, 9:55 pm
$
0
0

@tkclark wrote:

I’ve written an PWA that uses Ionic/Vue and Firebase. What I’d like is to keep the user logged in even after a browser refresh or the app relaunches if they’ve successfully authenticated once and not logged out. I’ve found this page on Firebase about Auth State Persistence. The code example makes it seem like I need to use firebase.auth.Auth.Persistence.LOCAL but it doesn’t talk much about querying this persistence later. Anyone ever done this before?

@aaronksaunders I know I pester you enough as it is! lol… But I’m getting close to the finish line! Have you ever wrote an app that’ll leave users logged in?

P.S. I should also note that I do want to store additional information for persistence and that I’m using Vuex. Not sure if these things should be considered the same or different.

Posts: 2

Participants: 2

Read full topic

↧
Search

Error : Cannot find name 'Let'(TS2304) ,'headers(TS2552)', 'options'

March 23, 2020, 11:11 pm
$
0
0

@lily28 wrote:

I am a beginner, I try to follow a tutorial and end up getting these errors:

Cannot find name ‘Let’(TS2304)
Cannot find name ‘headers’. Did you mean ‘Headers’?(TS2552)
Cannot find name ‘options’. Did you mean ‘Option’?(TS2552)

Below is my code for access-providers.ts

import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders, HttpErrorResponse } from '@angular/common/http';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/timeout';
import { fileURLToPath } from 'url';

@Injectable()
export class AccessProviders {
    //url backend api json
    server: string ='http://localhost/login-register-home/api';

    constructor(public http: HttpClient){}

    postData(body, file){
        Let headers = new HttpHeaders({
            'Content-Type' : 'application/json; charset=UTF-8'
        });
        Let options = {
            headers: headers
        }

        return this.http.post(this.server + file,JSON.stringify(body), options)
        .timeout(59000)// 59 sec timeout
        .map(res => res);
    }
}

Extra info:
Angular CLI & Angular: 9.0.7
Node: 12.16.1
rxjs : 6.5.4
typescript : 3.7.5

Can anyone help me out, thank you.

Posts: 1

Participants: 1

Read full topic

↧

Error: Could not find or load main class org.gradle.wrapper.GradleWrapperMain

March 24, 2020, 1:42 am
$
0
0

@kennRoss88 wrote:

Any of you guys encouter this issue when building for android?

ionic: 6.3.0

Android Studio project detected
ANDROID_HOME=/Users/kenneth/Library/Android/sdk
JAVA_HOME=/Library/Java/JavaVirtualMachines/jdk1.8.0_191.jdk/Contents/Home
studio
Subproject Path: CordovaLib
Subproject Path: app
Error: Could not find or load main class org.gradle.wrapper.GradleWrapperMain
/Users/kenneth/Documents/Ionic/testAndroid/platforms/android/gradlew: Command failed with exit code 1 Error output:
Error: Could not find or load main class org.gradle.wrapper.GradleWrapperMain

Posts: 1

Participants: 1

Read full topic

↧
↧

WMIC problem, Ionic 5

March 24, 2020, 2:42 am
$
0
0

@landsfiskalen wrote:

In later versions of Windows 10 WMIC seems to be deprecated. For example, if i try ionic info I get an error message:

Error: Command failed: wmic os get Caption

ERROR:
Description = Unspecified error


at makeError (C:\Users\andersp\AppData\Roaming\npm\node_modules\@ionic\cli\node_modules\execa\index.js:174:9)
at Function.module.exports.sync
(C:\Users\andersp\AppData\Roaming\npm\node_modules\@ionic\cli\node_modules\execa\index.js:338:15)
at windowsRelease
(C:\Users\andersp\AppData\Roaming\npm\node_modules\@ionic\cli\node_modules\windows-release\index.js:34:24)
at osName (C:\Users\andersp\AppData\Roaming\npm\node_modules\@ionic\cli\node_modules\os-name\index.js:39:18)
at Environment.getInfo (C:\Users\andersp\AppData\Roaming\npm\node_modules\@ionic\cli\lib\index.js:45:20)
at async InfoCommand.run (C:\Users\andersp\AppData\Roaming\npm\node_modules\@ionic\cli\commands\info.js:29:24)
at async Promise.all (index 0)
at async InfoCommand.execute (C:\Users\andersp\AppData\Roaming\npm\node_modules\@ionic\cli\lib\command.js:79:9)
at async Executor.run (C:\Users\andersp\AppData\Roaming\npm\node_modules\@ionic\cli\lib\executor.js:53:9)
at async Executor.execute
(C:\Users\andersp\AppData\Roaming\npm\node_modules\@ionic\cli\node_modules\@ionic\cli-framework\lib\executor.js:69:13)

This means I can no longer compile or do anything with my project.

I’m using Ionic 4 and Cordova 9. I’m pretty stumped as what to do now.

Regards,
Anders

Posts: 1

Participants: 1

Read full topic

↧

Cannot get '@ionic-native/file/ngx' to work

March 24, 2020, 2:51 am
$
0
0

@alexmehler wrote:

my app always fails with in the console :

Error: Uncaught (in promise): NullInjectorError: StaticInjectorError(AppModule)[CustomersPage -> File]:
StaticInjectorError(Platform: core)[CustomersPage -> File]:
NullInjectorError: No provider for File!

i dont even use the file in any function right now , just importing ‘@ionic-native/file/ngx’

already makes teh app fail … no matter if serve, run browser , cordova run android or capacitor run android …

holy shit its really hard to get into ionic with the fractured knowledgebase … ionic 3 , ioic 4 , cordova , capacitor … every tutorial is different , every example code on github or stack overflow is different , i now tried several methods just to implement a file api at all , not even doing anything with it

Posts: 2

Participants: 1

Read full topic

↧

Haw do i change the font size of all pages using ion-range in ionic 4

March 24, 2020, 3:59 am
$
0
0

@kawarien wrote:

Hello,

How can i change font size of all pages using ion-range. this code work only in my home page
home.component.html

<ion-range min="1" max="6" snaps="true" [(ngModel)]="fontSize"> </ion-range>

home.component.ts

fontSize: number;

thank in advance for your help

Posts: 1

Participants: 1

Read full topic

↧
Viewing all 49526 articles
Browse latest View live
Search
<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>