Hi there,

We are updating our app to use the latest ionic libraries and are getting the the following error during compilation – Argument of type 'Event' is not assignable to parameter of type 'CustomEvent<any>' (see screenshot below)

This can be easily replicated using the ionic example project (see below).

Please advise.

Error

Desktop-screenshot (23)1197×300 22.3 KB

Replication script

# start an ionic template project
cd /tmp
ionic start "$project_name" "sidemenu" --type="angular" --project-id="$project_id" --package-id="$project_id" --capacitor --no-interactive

# add ion-toggle
perl -pi -e 's#</ion-content>#<ion-toggle (ionChange)="toogleChanged($event)"></ion-toggle>\n\n</ion-content>#' $project_id/src/app/folder/folder.page.html
perl -pi -e 's#ngOnInit\(\)#toogleChanged(e: CustomEvent<any>){ console.log(e); }\n\n ngOnInit()#g' $project_id/src/app/folder/folder.page.ts

# reproduce error
cd $project_id
mkdir www && touch www/index.html
ionic cap add ios
ionic cap copy --prod --watch

Environment

$ ionic info

Ionic:

   Ionic CLI                     : 6.13.1 (/home/vagrant/.config/yarn/global/node_modules/@ionic/cli)
   Ionic Framework               : @ionic/angular 5.6.0
   @angular-devkit/build-angular : 0.1102.4
   @angular-devkit/schematics    : 11.2.4
   @angular/cli                  : 11.2.4
   @ionic/angular-toolkit        : 3.1.1

Capacitor:

   Capacitor CLI   : 2.4.7
   @capacitor/core : 2.4.7

Utility:

   cordova-res : not installed
   native-run  : 1.3.0

System:

   NodeJS : v14.15.0 (/home/vagrant/.nvm/versions/node/v14.15.0/bin/node)
   npm    : 6.14.8
   OS     : Linux 4.14

Thanks,
Mic.

1 post - 1 participant

Read full topic

Capacitor V3:

I’m trying simply to send an event from Android to JS. My plugin is working so far otherwise.

Does anyone have a working example of just calling JS from Android, no params?

Both of the documentation below have issues when I try to follow either approach:

• Capacitor - build cross platform apps with the web Plugin Events section Typescript doesn’t compile.
• Capacitor - build cross platform apps with the web cannot resolve symbol bridge

I’ve tried the following:

import { MyPlugin } from 'capacitor-plugin-myplugin';


MyPlugin.addEventListener('myEvent', () => { 
    // ....
})

But I get:

Property 'addListener' does not exist on type 'MyPlugin'.

If I extend my plugin class in the Java and do:

public class MyPlugin extends Plugin {
//....

then call:

bridge.triggerJSEvent("finishedPlaying", "window");

I get:

java.lang.NullPointerException: Attempt to invoke virtual method 'void com.getcapacitor.Bridge.triggerJSEvent(java.lang.String, java.lang.String)' on a null object reference

1 post - 1 participant

Read full topic

Hi There,
I am trying to export the camera result to Vue.

I am using capacitor, I know it should be a pretty easy solution but I am not able to figure this out.
the imageUrl varible is storing the image uri.

Many thanks

export function usePhotoGallery() {
    const { Camera } = Plugins;
  
    const takePhoto = async () => {
      const cameraPhoto = await Camera.getPhoto({
        resultType: CameraResultType.Uri,
        source: CameraSource.Camera,
        quality: 100,
 
      });
    
      console.log(cameraPhoto.webPath)
       var imageUrl = cameraPhoto.webPath 
        console.log(imageUrl)
   
    };
  
    return {
    
      takePhoto, 
    };
   
  }

1 post - 1 participant

Read full topic

// iget all table data i need just the one how insert the order not all users order

2376×669 23.3 KB

test376×668 7.09 KB

this.fetchRamassage()

let employeesRes = this.ramassageService.getRamassageList()

    employeesRes.snapshotChanges().subscribe(res =>{



      this.employees=[]

      res.forEach(item=>{

        let a = item.payload.toJSON()

        a['$key'] = item.key

        this.employees.push(a as Ramassage)

      })

    

    })

}

fetchRamassage(){

this.ramassageService.getRamassageList().valueChanges().subscribe(res => {

  console.log(res)

 

} )

}

1 post - 1 participant

Read full topic

I installed admob-plud plugin and I can’t build my android app.

I have this error:

Android resource linking failed
[cordova]   C:\projects\myapp\platforms\android\app\build\intermediates\merged_manifests\debug\AndroidManifest.xml:23: AAPT: error: unexpected element <queries> found in <manifest>.

Ionic:

   Ionic CLI                     : 5.4.4 (C:\Users\l.santaniello\AppData\Roaming\npm\node_modules\ionic)
   Ionic Framework               : @ionic/angular 5.5.4
   @angular-devkit/build-angular : 0.1000.8
   @angular-devkit/schematics    : 10.0.8
   @angular/cli                  : 10.0.8
   @ionic/angular-toolkit        : 2.3.3

Cordova:

   Cordova CLI       : 9.0.0 (cordova-lib@9.0.1)
   Cordova Platforms : android 8.1.0, browser 6.0.0
   Cordova Plugins   : cordova-plugin-ionic-keyboard 2.2.0, cordova-plugin-ionic-webview 4.2.1, (and 7 other plugins)

Utility:

   cordova-res : 0.6.0 (update available: 0.15.3)
   native-run  : 0.2.8 (update available: 1.3.0)

System:

   NodeJS : v10.16.3 (C:\Program Files\nodejs\node.exe)
   npm    : 6.9.0
   OS     : Windows 10

I read that the reason is a gradle version but I not understend how solve the issue.

Could you please help me?

Thanks
L

2 posts - 1 participant

Read full topic

hi team, I bring you this query as the matter says.

  <ion-header>
  <ion-toolbar color="asid">
    <ion-buttons slot="start">
      <ion-back-button defaultHref="/listar-checklist"></ion-back-button>
    </ion-buttons>
    <ion-title>Nuevo Checklist</ion-title>
  </ion-toolbar>
</ion-header>

<ion-content>
  <div id="container">
    <form [formGroup]="checkForm" (ngSubmit)="submit()">


      <ion-card style="background-color: rgb(170, 196, 245)">
        <ion-card-header style="text-align: center">

            <!--SELECCION DE OPERARIO-->

            <ion-select placeholder="Seleccione Operario" #C (ionChange)="onSelectOperario($event.detail.value)">
              <ion-select-option
                *ngFor="let usuario of operarioArray"
                [value]="usuario">
                {{usuario.$$title}}
              </ion-select-option>
            </ion-select>

            <!--SELECCION DE vehiculo-->

            <ion-select placeholder="Seleccione Vehiculo" #C (ionChange)="onSelectVehiculo($event.detail.value)">
              <ion-select-option
                *ngFor="let dominio of vehiculoArray"
                [value]="dominio">
                {{dominio.$$title}}
              </ion-select-option>
            </ion-select>


          <!-- </ion-card-title> -->
        </ion-card-header>
      </ion-card>
      <ion-card>

        <ion-item>
          <ion-icon name="medkit" slot="start"></ion-icon>
          Identificacion: &nbsp;
          <ion-input type="text" formControlName="identificacion"></ion-input>
        </ion-item>

        <ion-item>
          <ion-icon name="medkit" slot="start"></ion-icon>
          Destino: &nbsp;
          <ion-input type="text" formControlName="destino"></ion-input>
        </ion-item>

        <ion-item>
          <ion-icon name="medkit" slot="start"></ion-icon>
          <ion-label>Fecha de Salida</ion-label>
          <ion-datetime
            value="03-06-2021"
            formControlName="fechaDeSalida"
            displayFormat="DD/MM/YYYY"
            pikerFormat="YYYY MM DD"
            placeholder="Seleccione Fecha"
            cancelText="Cancelar"
            doneText="OK"
          ></ion-datetime>
        </ion-item>


        <ion-item>
          <ion-icon name="medkit" slot="start"></ion-icon>
          <ion-label>Documentacion</ion-label>
          <ion-select interface="popover" formControlName="documentacion">
            <ion-select-option>Habilitado</ion-select-option>
            <ion-select-option>NoHabilitado</ion-select-option>
          </ion-select>
        </ion-item>


        <ion-item>
          <ion-icon name="medkit" slot="start"></ion-icon>
          <ion-label>Tablero</ion-label>
          <ion-select interface="popover" formControlName="tablero">
            <ion-select-option>Habilitado</ion-select-option>
            <ion-select-option>NoHabilitado</ion-select-option>
          </ion-select>
        </ion-item>


        <ion-item>
          <ion-icon name="medkit" slot="start"></ion-icon>
          <ion-label>Laterales</ion-label>
          <ion-select interface="popover" formControlName="laterales">
            <ion-select-option>Habilitado</ion-select-option>
            <ion-select-option>NoHabilitado</ion-select-option>
          </ion-select>
        </ion-item>


        <ion-item>
          <ion-icon name="medkit" slot="start"></ion-icon>
          <ion-label>Seccion Trasera</ion-label>
          <ion-select interface="popover" formControlName="seccionTrasera">
            <ion-select-option>Habilitado</ion-select-option>
            <ion-select-option>NoHabilitado</ion-select-option>
          </ion-select>
        </ion-item>


        <ion-item>
          <ion-icon name="medkit" slot="start"></ion-icon>
          <ion-label>Frente</ion-label>
          <ion-select interface="popover" formControlName="frente">
            <ion-select-option>Habilitado</ion-select-option>
            <ion-select-option>NoHabilitado</ion-select-option>
          </ion-select>
        </ion-item>

        <ion-item>
          <ion-icon name="medkit" slot="start"></ion-icon>
          Comentarios: &nbsp;
          <ion-input type="text" formControlName="comentarios"></ion-input>
        </ion-item>
        
        **<ion-item>
          <ion-icon name="medkit" slot="start"></ion-icon>
          Fotos: &nbsp;
          <ion-input type="file" formControlName="fotos"></ion-input>
        </ion-item>**

      </ion-card>

      <ion-button
        type="submit"
        style="background-color: rgb(170, 196, 245)"
      >
        Guardar
      </ion-button>
    </form>
  </div>
</ion-content>


This is the error that I am getting now when I try to upload a photo


 https://i.stack.imgur.com/IdrC9.jpg


I await answers
best regards

1 post - 1 participant

Read full topic

I’m trying to use SQLite in Ionic application

I’ve installed:

ionic cordova plugin add cordova-sqlite-storage
npm install @ionic-native/sqlite

in app.modules.ts:

import { SQLite } from '@ionic-native/sqlite/ngx'; as SQLite in imports and private sqlite: SQLite in home.page.ts constructor

then with ionic serve -w chrome I got [ERROR] ng has unexpectedly closed (exit code 127).

in angular.errors.log:

[error] Error: The target entry-point “@ionic-native/sqlite” has
missing dependencies:

• @ionic-native/core

  at TargetedEntryPointFinder.findEntryPoints (D:\app\node_modules@angular\compiler-cli\ngcc\src\entry_point_finder\targeted_entry_point_finder.js:40:23)
  at D:\app\node_modules@angular\compiler-cli\ngcc\src\execution\analyze_entry_points.js:29:41
  at SingleProcessExecutorSync.SingleProcessorExecutorBase.doExecute (D:\app\node_modules@angular\compiler-cli\ngcc\src\execution\single_process_executor.js:28:29)
  at D:\app\node_modules@angular\compiler-cli\ngcc\src\execution\single_process_executor.js:57:59
  at SyncLocker.lock (D:\app\node_modules@angular\compiler-cli\ngcc\src\locking\sync_locker.js:34:24)
  at SingleProcessExecutorSync.execute (D:\app\node_modules@angular\compiler-cli\ngcc\src\execution\single_process_executor.js:57:27)
  at Object.mainNgcc (D:\app\node_modules@angular\compiler-cli\ngcc\src\main.js:74:25)
  at Object.process (D:\app\node_modules@angular\compiler-cli\ngcc\index.js:29:23)
  at NgccProcessor.processModule (D:\app\node_modules@ngtools\webpack\src\ngcc_processor.js:163:16)
  at D:\app\node_modules@ngtools\webpack\src\ivy\host.js:55:18
  at D:\app\node_modules@ngtools\webpack\src\ivy\host.js:47:24
  at Array.map ()
  at Object.host.resolveModuleNames (D:\app\node_modules@ngtools\webpack\src\ivy\host.js:45:32)
  at actualResolveModuleNamesWorker (D:\app\node_modules\typescript\lib\typescript.js:102904:133)
  at resolveModuleNamesWorker (D:\app\node_modules\typescript\lib\typescript.js:103126:26)
  at resolveModuleNamesReusingOldState (D:\app\node_modules\typescript\lib\typescript.js:103200:24)

Advice would be helpful

1 post - 1 participant

Read full topic

I want to do a Selenium course by professional. Which will be the best site for achieving my goal or What is the best way to complete Selenium professional course within 10days.

1 post - 1 participant

Read full topic

How can i allow user to change their app icon from user end Thats means user can change their app icon as per your choice is the any chance to do that with ionic ? please let me know

1 post - 1 participant

Read full topic

We’re looking for experienced Ionic/Hybrid Mobile app/PWA/Cordova developers for an exciting new startup. We’re a Danish (EU) based company with offices in Denmark and Manila (PH).

The current job openings are for our Manila based office, where you’ll be able to work in a combination of remote and onsite.

We offer great benefits and nice, competent colleagues working with technologies such as React.js, C#, Typescript, Clojure/ClojureScript and cloud hosting with Azure and AWS.

Please note we’re looking for employees to hire full time, being able to go to our Manila offices, not 100% remote or freelancers/consultants.

4 posts - 4 participants

Read full topic

Hi there

As per new specs the Ionic Storage has a new API which requires you to invoke storage.create() before using it for the first time.

I am not clear about where to do this if I have a storage that is to be used across the app - do I need to do the create in app.component.ts, or do I actually need to create a service that wraps storage and provides for the initial create?

In the earlier API, the create was done through the module include at app.module.ts (implicitly).

Any thoughts would be very welcome!

Thx

2 posts - 2 participants

Read full topic

A completely new form of investment and an opportunity to develop fast and passive money even while sleeping. Just join the registration Wefinex.tv and you have the opportunity to get rich instantly.

Wefinex is a binary coefficient trading financial system with unlimited money exchange and when you sign up to receive a huge demo up to $ 1000, enjoy the experience and search through it to improve your knowledge of wefinex.

Wefinex is a form of predicting the value of an asset (stocks, gold, exchange rate…). If you correctly predict the upward and downward trend of the asset’s value, you will receive money and each time you trade you will receive a bonus code and be able to enter a sweepstakes with wefinex.

Many people believe that wefinex is a form of gambling, but it is not really a completely new form of financial investment and has the basis if the user is really knowledgeable about finance, and yes From experience, predicting the market’s up and down trend is extremely simple and is an extremely useful money-making channel.

In addition, if you do not want to directly participate in playing wefinex then wefinex also has another policy is the system to buy the agent rights. As long as you introduce more players to wefinex, you will receive additional commission and this commission will add to you more if that player introduces more of their friends.

Listening to here is so fascinating, don’t wait any longer without our wefinex subscription.

1 post - 1 participant

Read full topic

here i am providing you a few websites please provide me feedback HGH injections for weight loss

1 post - 1 participant

Read full topic

Hello,

I am looking for a way to add a button to the selection menu on mobile (IOS and Android) in my application.

modifié1100×700 107 KB

I have long researched how to do this and most of the time you had to delete the menu to replace it with a created one, but that’s not what I want.

Thanks to those who will answer me !

1 post - 1 participant

Read full topic

I have a capacitor app which works fine for Android, and for iOS, it’s a little different:

I use vue-cli-plugin-capacitor to run in the development mode, which will set the server://xxx.xxx.xxx.xxx:8080 in the capacitor.config.json, it works.

The problem occurs in the release mode. When I package the app using Xcode and run, the app is running, but some call to the remote server is reject because of CORS restriction:

The request send out from capacitor is:

Content-Type: application/json;charset=UTF-8
Origin: capacitor://localhost
Accept: /
User-Agent: Mozilla/5.0 (iPhone; CPU iPhone OS 14_4 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Mobile/15E148
X-SDK-Version: @cloudbase/js-sdk/1.4.0
x-seqid: ec0772ba0a37d

As I cannot config the allowed Origin start from capacitor://, how to change this origin value to http://localhost?

2 posts - 2 participants

Read full topic

I have many duplicate packages in my Android studio project:

packages568×648 68.5 KB

• How can I find out which ones are actually being used?
• How can I safely delete the duplicates?

4 posts - 2 participants

Read full topic

I want to deploy an ionic 5 PWA project on Azure for viewing on the web and a phone but the app reroutes it to \home. if you refresh the site or try to “add to home screen” the link is unusable so the app fails.
I have tried a blob storage folder but you cannot surf to \index.html
Then a blob storage website using the “static website” option - this allows it to run, but never refresh or install.
The a regular web app with the same results.

Ionic version 3 did not have any of these problems.

1 post - 1 participant

Read full topic

PS C:\ionic\appmysql> ionic serve
> ng.cmd run app:serve --host=localhost --port=8100
[ng] An unhandled exception occurred: ngcc is already running at process with id 12260.
[ng] If you are running multiple builds in parallel then you might try pre-processing your node_modules via the command line ngcc tool before starting the builds.
cli/ngcc/__ngcc_lock_file__.)
[ng] See "C:\Users\AlvgMaker\AppData\Local\Temp\ng-Imd7P3\angular-errors.log" for further details.

[ERROR] ng has unexpectedly closed (exit code 127).

1 post - 1 participant

Read full topic

Hello,

I am trying ionic cap sync and it gives the error from the title, anyone knows how to solve it? Thank you

Regards

I am using Ionic 5 + Capacitor 2

[!] CocoaPods could not find compatible versions for pod "CapacitorLocalNotifications":
  In Podfile:
    CapacitorLocalNotifications (from `../../node_modules/@capacitor/local-notifications`)

Specs satisfying the `CapacitorLocalNotifications (from `../../node_modules/@capacitor/local-notifications`)` dependency were found, but they required a higher minimum deployment target.

1 post - 1 participant

Read full topic

Hello There!
I’am developing an angular 10 ionic app with capacitor for android and ios. Inside my app, I load an external website with the inAppBrowser wich contains youtube embeds (iframes).

On Android, when I click on the play button, the embedded youtube video plays & behaves as expected. On iOS on the other hand, youtube displays the error message “This video cannot be played in your browser”.

Maybe my error is related to the one described in this thread, but the solutions posted there didn’t work.

The error seems to have nothing to do with the inAppBrowser or the external website, because I tried to use an youtube iframe directly in my app.component.html (instead of loading the inappbrowser) and got the same error as before.

Any ideas how to solve this?

1 post - 1 participant

Read full topic