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

[ionic4] Ionic serve take more than 1 mins to load / reload

$
0
0

@sameera207 wrote:

hey all,

I’m trying to run a blank ionic 4 app (angular) and it takes more than 60 seconds to initial load and also and reloads after doing changes.

I would expect this is not to be the normal case and wanted to know if anyone else is also seeing the same. And if this is a know issue, any fix. I had a quick search and couldn’t find anything related to ionic4

Following are my ionic info

Ionic:

   ionic (Ionic CLI)             : 4.5.0 (/usr/local/lib/node_modules/ionic)
   Ionic Framework               : @ionic/angular 4.0.0-beta.17
   @angular-devkit/build-angular : 0.10.7
   @angular-devkit/schematics    : 7.0.7
   @angular/cli                  : 7.0.7
   @ionic/angular-toolkit        : 1.2.0

System:

   NodeJS : v8.10.0 (/usr/local/bin/node)
   npm    : 6.5.0
   OS     : macOS High Sierra

and I can see the following in my command line

thanks in advance

PS: I’m trying with a brand new ionic app

Posts: 1

Participants: 1

Read full topic


Backgroundmode plugin pushes app to background when permission modals open

$
0
0

@fiyiem wrote:

hi, I am using ionic 3 and testing on Android 6.0 - Samsung Galaxy S7.

I added the native plugin ("@ionic-native/background-mode": “^4.17.0”) to my app and it is working as expected when app goes into the background and comes out again.
But, I see the following behaviour as well- couple of pages on my app request permissions from the user when they run the app the first time after installation - to use location when user tries to scan for bluetooth devices (plugin ionic-native/bluetooth-serial": “^4.5.3”) and read/write permission when they write a file to the phone (ionic-native/file": “^4.7.0”).

After adding backgroundmode plugin the app goes into background when the permission modals open for location and file writing.

I am listening to these events-

this.backgroundMode.on(“activate”)
this.backgroundMode.on(“deactivate”)
this.backgroundMode.on(‘failure’)

Thank you so much for reading. If you need more information about my setup please ask. Any help is appreciated. If this is a bug, how do I report this? Cheers!

Posts: 1

Participants: 1

Read full topic

Crop image in rectangular shape

Build error:Could not determine java version from '10.0.2'

$
0
0

@jsriganesh wrote:

FAILURE: Build failed with an exception.

  • What went wrong:
    Could not determine java version from ‘10.0.2’.

  • Try:
    Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output.

  • Get more help at https://help.gradle.org
    /home/appuser/apkgen/platforms/android/gradlew: Command failed with exit code 1 Error output:
    FAILURE: Build failed with an exception.

  • What went wrong:
    Could not determine java version from ‘10.0.2’.

  • Try:
    Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output.

  • Get more help at https://help.gradle.org
    [ERROR] An error occurred while running subprocess cordova.

      cordova build android --release exited with exit code 1.
    
      Re-running this command with the --verbose flag may provide more information.

Posts: 1

Participants: 1

Read full topic

How to use Image Viewer with InnerHTML

$
0
0

@onurgunes wrote:

Hello,

In a part of my app, I have to get html content from web service and put it on the screen. The content come from the service usually contains p, img and h tags.
I did this part with [innerHTML] attribute. But when I want to use Image Viewer, it didn’t work.
I tried the package without innerHtml. It worked.

So how can I use Ionic Image Viewer with innerHtml?

I tried Pipe but it didn’t work for me.

Sample content:

<p>Title</p>
<img src="www.site.com/image.png" imageViewer />

Html file:

<ion-content padding>
  <div [innerHTML]="content | safeHtml"></div>
</ion-content>

Typescript file:

this.http.get('http://myurladdress.com/', {}, {})
    .then(data => {
      this.content = JSON.parse(data.data);
    })
    .catch(error => {
      //...
    });

Posts: 1

Participants: 1

Read full topic

Deploy Live Update ( No makes changes)

$
0
0

@damianrosso wrote:

Hello Team, i need some help with the deploy live version, i follow all the steps

. New Proyect (and ionic serve)
. Deploy to android
. Up to git and then link to AppFlow
. Build and set channel Production / Master
. set the cordova-plugin-ionic
. Makes some changes in home.html
. git push and deploy to channel again and nothing change in the android app

config.xml





Some help Maybe? Sorry for my english

Thanks a Lot!

Posts: 1

Participants: 1

Read full topic

Starting out errors (new computer, new installation, node-sass and python errors)

$
0
0

@loki9182 wrote:

I’ve just built a brand new computer and I’m getting errors when starting a new Ionic project. What am-I missing?

I’ve installed nodejs, angular cli, ionic cli, etc… here is my resulting ionic info

Ionic:

   ionic (Ionic CLI)             : 4.5.0 (C:\Users\lucch\AppData\Roaming\npm\node_modules\ionic)
   Ionic Framework               : @ionic/angular 4.0.0-beta.17
   @angular-devkit/build-angular : 0.10.7
   @angular-devkit/schematics    : 7.0.7
   @angular/cli                  : 7.0.7
   @ionic/angular-toolkit        : 1.2.0

System:

   NodeJS : v11.3.0 (C:\Program Files\nodejs\node.exe)
   npm    : 6.4.1
   OS     : Windows 10

I then start a new project as follow:

ionic start test blank --type angular

Here is the resulting stack:

C:\temp\ionic\test1>npm install

> node-sass@4.9.3 install C:\temp\ionic\test1\node_modules\node-sass
> node scripts/install.js

Downloading binary from https://github.com/sass/node-sass/releases/download/v4.9.3/win32-x64-67_binding.node
Cannot download "https://github.com/sass/node-sass/releases/download/v4.9.3/win32-x64-67_binding.node":

HTTP error 404 Not Found

Hint: If github.com is not accessible in your location
      try setting a proxy via HTTP_PROXY, e.g.

      export HTTP_PROXY=http://example.com:1234

or configure npm proxy via

      npm config set proxy http://example.com:8080

> node-sass@4.9.3 postinstall C:\temp\ionic\test1\node_modules\node-sass
> node scripts/build.js

Building: C:\Program Files\nodejs\node.exe C:\temp\ionic\test1\node_modules\node-gyp\bin\node-gyp.js rebuild --verbose --libsass_ext= --libsass_cflags= --libsass_ldflags= --libsass_library=
gyp info it worked if it ends with ok
gyp verb cli [ 'C:\\Program Files\\nodejs\\node.exe',
gyp verb cli   'C:\\temp\\ionic\\test1\\node_modules\\node-gyp\\bin\\node-gyp.js',
gyp verb cli   'rebuild',
gyp verb cli   '--verbose',
gyp verb cli   '--libsass_ext=',
gyp verb cli   '--libsass_cflags=',
gyp verb cli   '--libsass_ldflags=',
gyp verb cli   '--libsass_library=' ]
gyp info using node-gyp@3.8.0
gyp info using node@11.3.0 | win32 | x64
gyp verb command rebuild []
gyp verb command clean []
gyp verb clean removing "build" directory
gyp verb command configure []
gyp verb check python checking for Python executable "python2" in the PATH
gyp verb `which` failed Error: not found: python2
gyp verb `which` failed     at getNotFoundError (C:\temp\ionic\test1\node_modules\which\which.js:13:12)
gyp verb `which` failed     at F (C:\temp\ionic\test1\node_modules\which\which.js:68:19)
gyp verb `which` failed     at E (C:\temp\ionic\test1\node_modules\which\which.js:80:29)
gyp verb `which` failed     at C:\temp\ionic\test1\node_modules\which\which.js:89:16
gyp verb `which` failed     at C:\temp\ionic\test1\node_modules\isexe\index.js:42:5
gyp verb `which` failed     at C:\temp\ionic\test1\node_modules\isexe\windows.js:36:5
gyp verb `which` failed     at FSReqCallback.oncomplete (fs.js:161:21)
gyp verb `which` failed  python2 { Error: not found: python2
gyp verb `which` failed     at getNotFoundError (C:\temp\ionic\test1\node_modules\which\which.js:13:12)
gyp verb `which` failed     at F (C:\temp\ionic\test1\node_modules\which\which.js:68:19)
gyp verb `which` failed     at E (C:\temp\ionic\test1\node_modules\which\which.js:80:29)
gyp verb `which` failed     at C:\temp\ionic\test1\node_modules\which\which.js:89:16
gyp verb `which` failed     at C:\temp\ionic\test1\node_modules\isexe\index.js:42:5
gyp verb `which` failed     at C:\temp\ionic\test1\node_modules\isexe\windows.js:36:5
gyp verb `which` failed     at FSReqCallback.oncomplete (fs.js:161:21)
gyp verb `which` failed   stack:
gyp verb `which` failed    'Error: not found: python2\n    at getNotFoundError (C:\\temp\\ionic\\test1\\node_modules\\which\\which.js:13:12)\n    at F (C:\\temp\\ionic\\test1\\node_modules\\which\\which.js:68:19)\n    at E (C:\\temp\\ionic\\test1\\node_modules\\which\\which.js:80:29)\n    at C:\\temp\\ionic\\test1\\node_modules\\which\\which.js:89:16\n    at
 C:\\temp\\ionic\\test1\\node_modules\\isexe\\index.js:42:5\n    at C:\\temp\\ionic\\test1\\node_modules\\isexe\\windows.js:36:5\n    at FSReqCallback.oncomplete (fs.js:161:21)',
gyp verb `which` failed   code: 'ENOENT' }
gyp verb check python checking for Python executable "python" in the PATH
gyp verb `which` succeeded python C:\Users\lucch\AppData\Local\Programs\Python\Python37-32\python.EXE
gyp ERR! configure error
gyp ERR! stack Error: Command failed: C:\Users\lucch\AppData\Local\Programs\Python\Python37-32\python.EXE -c import sys; print "%s.%s.%s" % sys.version_info[:3];
gyp ERR! stack   File "<string>", line 1
gyp ERR! stack     import sys; print "%s.%s.%s" % sys.version_info[:3];
gyp ERR! stack                                ^
gyp ERR! stack SyntaxError: invalid syntax
gyp ERR! stack
gyp ERR! stack     at ChildProcess.exithandler (child_process.js:294:12)
gyp ERR! stack     at ChildProcess.emit (events.js:182:13)
gyp ERR! stack     at maybeClose (internal/child_process.js:978:16)
gyp ERR! stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:265:5)
gyp ERR! System Windows_NT 10.0.17763
gyp ERR! command "C:\\Program Files\\nodejs\\node.exe" "C:\\temp\\ionic\\test1\\node_modules\\node-gyp\\bin\\node-gyp.js" "rebuild" "--verbose" "--libsass_ext=" "--libsass_cflags=" "--libsass_ldflags=" "--libsass_library="
gyp ERR! cwd C:\temp\ionic\test1\node_modules\node-sass
gyp ERR! node -v v11.3.0
gyp ERR! node-gyp -v v3.8.0
gyp ERR! not ok
Build failed with error code: 1
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.4 (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.4: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: node-sass@4.9.3 (node_modules\node-sass):
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: node-sass@4.9.3 postinstall: `node scripts/build.js`
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: Exit status 1

audited 49790 packages in 6.363s
found 0 vulnerabilities

I’ve downloaded and installed Python on my machine, added it to the path and it doesn’t make any difference. I might find a solution to this by messing around but I’m documenting it for newcomers to Ionic. If you follow the “getting started” procedures on the Ionic page, this should work out of the box and not require any messing around. I’ve been working on an app since Ionic v1 and rebuilt it many times (currently rebuilding it in the latest Ionic v4) so I don’t know what my old machine has installed to fix this problem anymore. What does a new machine need to have installed to make this work?

I’ll try rolling back to node 10 first and see what that does.

Posts: 1

Participants: 1

Read full topic

Argument of type is not assigned to the local notification

$
0
0

@rajbasilio wrote:

This is my code

this.platform.ready().then(() => {
      this.localNotifications.schedule({    // ionic local notification native plugin.
        title: 'Welcome',
        text: 'xxxxxxxxxx',
        at: new Date(new Date().getTime() + 1000)
      })
    })

When use the at variable i get the error as

Argument of type ‘{ title: any; text: string; at: Date; }’ is not assignable to parameter of type ‘ILocalNotification | ILocalNotification’.
Object literal may only specify known properties, and ‘at’ does not exist in type ‘ILocalNotification | ILocalNotification’.

I want to prompt the notification after 1 sec. How can I do it ?

Posts: 1

Participants: 1

Read full topic


How to select one of multiple API's using radio buttons

Testing on Android

$
0
0

@douglapsley wrote:

Hi. I have an app that builds fine as a Package on the Ionic site. The IPA runs fine on iOS. But when I install the APK on my Android device it fails. It seems to load the app and then clearly something breaks it as it just halts.

The app runs fine when using “ionic serve”. It also runs fine on Android through the Ionic Dev app. It’s only when I compile the APK that it has problems.

I am running Linux and don’t have Android studio installed (and I’d really rather keep it that way).

Is there any way I can get feedback about what is causing the app to fail?

Thank you!

Posts: 1

Participants: 1

Read full topic

Requirements check failed for JDK 1.8 on Mac

$
0
0

@bmcgowan94 wrote:

Hi there, I get this error anytime I try to run my app on an android emulator or device.

From looking it up online its likely something to do with my java versioning… but on my Mac I’m really not sure how to resolve.

I’ve now downloaded a correct java version (I think), but I’m not sure how to point JAVA_HOME to it.
Ive also tried deleting Java and reinstalling but cordova seems to still be pointing at the wrong version.

Please help as I now cannot continue the development of an app :frowning:

Many thanks!

Posts: 1

Participants: 1

Read full topic

Why Ionic Local Storage work with only promise!

$
0
0

@gaiapuffo wrote:

Hi, I work with Ionic 4 and I have to implemented a login page. So I use Ionic Local Storage for save the token of the user and retrieve this token for the authentication. But if I use Ionic Locale Storage I retrieve my token but the code go ahead is not correct in the case of login…

Posts: 1

Participants: 1

Read full topic

PWA, how to wait for user to accept 'allow location'

$
0
0

@totoni wrote:

Hi
I’m building a PWA with Google Maps Javascript API.
When loading I want to know the user location. (If the user answers Yes.)
As it is now user have to do a refresh after answer Yes… How to wait for the user to accept locationsharing?
Also, what to do if the user answers No?

ionViewDidLoad(){

     this.loadMap();

 //loading some wordpress posts
    if(!(this.posts.length > 0)){
      let loading = this.loadingCtrl.create();
      loading.present();

      this.wordpressService.getRecentPosts(this.categoryId)
      .subscribe(data => {
        for(let post of data){
          post.excerpt.rendered = post.excerpt.rendered.split('<a')[0] + "</p>";
          this.posts.push(post);
        }

      this.addMarker();
      loading.dismiss();
      });
    }

  }



loadMap(){

    this.geolocation.getCurrentPosition().then((position) => {
   
      this.currentPosition=position;
     let latLng = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);


       let mapOptions = {
         center: latLng,
         zoom: 10,
         mapTypeId: google.maps.MapTypeId.ROADMAP
       }

       this.map = new google.maps.Map(this.mapElement.nativeElement, mapOptions);
       this.map.addListener('click', (e) => {
            this.mapClick();
        });


     }, (err) => {
       console.log( err);
     });


 }

addMarker(){
   // adding markers to the map
 }

Posts: 1

Participants: 1

Read full topic

Ionic 3/4 not compilable on Android Studio 3.2.1

$
0
0

@DonStegall wrote:

I have used ionic 1 and 2 and had no trouble with compiling for iOS on XCode and Android on Android Studio on macOS. I have every package available from the Google repositories installed on my Android/sdk and I cannot get either ionic 3 or ionic 4 apps compiled on Android Studio 3.2.1 and I’m getting quite frustrated as I have been working on this for about a week. I have zero problems with either 3 or 4 and XCode. I have hacked at the files to try to get a working gradle wrapper. Now I’m getting mips library message and nothing I do fixes the issue. I have overwritten the build.gradle file with one that works fine on native Android apps. I know my Android environment works. When opening an ionic android platform it also messes with my Android Studio Tools menu and the AVD Manager and SDK Manager options go away. I’m sure I can make it work with some file removal and fixing things myself. I have a lot of web sites in Angular 4 with Bootstrap 3.3.7 and I would really like to be able to use ionic, but right now, it looks like I may have to go back to Xamarin Forms apps that work fine with VS 2017 for Mac.

Even my wife likes the ionic sidemenu apps better than my Xamarin work, and so do I.

But if ionic apps won’t work on Android natively, and not using Ionic DevApp, I will have to abandon ionic … probably for good.

Posts: 4

Participants: 2

Read full topic

Ion-select no refresh

$
0
0

@Motero69 wrote:

Im using Ionic 4

have this code:

        <ion-select [(ngModel)]="IDEscuel" (ionChange)='Cambio_Escuela()' placeholder="Seleccione una Escuela">
            <ion-select-option value="SE" selected> Seleccione Escuela</ion-select-option>
            <ion-select-option *ngFor="let escuela of Escuelas" [value]='escuela.id'> {{ escuela.nombre }} </ion-select-option>
        </ion-select>

I fill Escueles from database

 this._profileServ.getEscuelasPaisEstado(this.Pais,this.Estado).then((EscuelasL:any) => {
                    this.Escuelas = EscuelasL;    
 });  

then when the this.Pais change I refill the this.Escuelas, but if the data from database is empty instead of clean or list of Escuelas the control how the same list that was before, if I console.log the value of this.Escuelas it show empty. but in the app show the list before.

Any help

Posts: 1

Participants: 1

Read full topic


Problem when changing the image on the server, continues showing the previous image

$
0
0

@diego6545 wrote:

hello to all, my problem happens when I implement the update of the profile image in my application, the first time it does the user changes the default image and places the one I previously loaded, but if the user tries to change the image again, still shows the previous one, what happens is that the server saves the image with the “id” of the user therefore the route does not change I think that is why the new image is not updated in the view, or I do not know if be cache problem. I hope you can help me.

Ionic:

ionic (Ionic CLI) : 4.5.0
Ionic Framework : ionic-angular 3.9.2
@ionic/app-scripts : 3.2.0

Cordova:

cordova (Cordova CLI) : 8.1.2 (cordova-lib@8.1.1)
Cordova Platforms : android 7.1.2, browser 5.0.4

NodeJS : v9.5.0
npm : 5.6.0
OS : Windows 10

Posts: 1

Participants: 1

Read full topic

Health plugin won't compile for android

$
0
0

@gotters wrote:

I am trying to use the native health plugin found here

The plugin won’t build for android as I get the errors below. Has anyone had any luck with this?

Please advise

C:\Workspace\Apps\ProjectT\Mobilev2\platforms\android\src\org\apache\cordova\health\HealthPlugin.java:574: error: cannot find symbol
            builder.addScope(new Scope(Scopes.FITNESS_BLOOD_GLUCOSE_READ));
                                             ^
  symbol:   variable FITNESS_BLOOD_GLUCOSE_READ
  location: class Scopes
C:\Workspace\Apps\ProjectT\Mobilev2\platforms\android\src\org\apache\cordova\health\HealthPlugin.java:576: error: cannot find symbol
            builder.addScope(new Scope(Scopes.FITNESS_BLOOD_GLUCOSE_READ_WRITE));
                                             ^
  symbol:   variable FITNESS_BLOOD_GLUCOSE_READ_WRITE
  location: class Scopes
C:\Workspace\Apps\ProjectT\Mobilev2\platforms\android\src\org\apache\cordova\health\HealthPlugin.java:579: error: cannot find symbol
            builder.addScope(new Scope(Scopes.FITNESS_BLOOD_PRESSURE_READ));
                                             ^
  symbol:   variable FITNESS_BLOOD_PRESSURE_READ
  location: class Scopes
C:\Workspace\Apps\ProjectT\Mobilev2\platforms\android\src\org\apache\cordova\health\HealthPlugin.java:581: error: cannot find symbol
            builder.addScope(new Scope(Scopes.FITNESS_BLOOD_PRESSURE_READ_WRITE));
                                             ^
  symbol:   variable FITNESS_BLOOD_PRESSURE_READ_WRITE
  location: class Scopes
Note: C:\Workspace\Apps\ProjectT\Mobilev2\platforms\android\src\org\apache\cordova\splashscreen\SplashScreen.java uses or overrides a deprecated API.
Note: Recompile with -Xlint:deprecation for details.

Posts: 1

Participants: 1

Read full topic

Add a Select all to a ionic-select box

$
0
0

@helpmelearn wrote:

Right now we have a multi-select box. They wanted some way to add a select all to it.
I knew the select box used some alert values so my original idea was to add a third button that would toggle the list, either select them all or deselect them all.

Not as easy as I would like. Even though the documentation for ion-select does say it uses the options that alert controller has, there is no way that I can see to add or even change the buttons. (only the title).

Next is adding in an extra row with this.
(ionSelect)="selectAll($event)

As far as I can tell this only gets called when the checkbox is being checked, when it gets unchecked it doesn’t fire.
Is there an easy way to do this?

Posts: 3

Participants: 2

Read full topic

How to use a javascript sdk in an existing ionic project?

$
0
0

@OddNo7 wrote:

I’m trying to use disnode_sdk inside my ionic project, and in the tsconfig.json I set “allowJS” to true, but I ran into problems, something like “cannot write file because it would overwrite input file”

This is the folder structure:

And this is the tsconfig.json before adding disnode_sdk:
Screenshot%20from%202018-12-13%2015-44-35

So where should I put the sdk? and how should I configure my project to avoid errors?

Posts: 1

Participants: 1

Read full topic

Ionic 4 WifiWizard2 - cordova pluing

$
0
0

@programaya wrote:

Hi

I’m testing ionic4

in ionic 3 I use a cordova plugin called WifiWizard. that now has the new version WifiWizard2

to use this plugin in ionic 3 simply on the page I wrote

declare let WifiWizard2: any;

and then in the code I could directly use its functions for example
WifiWizard2.conect ();

but now with ionic4 this is not so.

can someone help me to know how to use WifiWizard2 on ionic4?

Thank you

Posts: 1

Participants: 1

Read full topic

Viewing all 48989 articles
Browse latest View live


<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>