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

How can I get the total price in my cart by getting the sum of all the prices?

$
0
0

@RyannChristiann wrote:

I’m using Ionic 3 and Firebase as my Database How can I get the total price on my cart?

This is my Html, dynamic data from firebase

<ion-content padding>
    <ion-content padding>
      <ion-list *ngFor="let item of orderList$ | async">
        <ion-item>
          <ion-label text-wrap>
            <h2>{{item?.name}}</h2>
            <p  style="color: black">Quantity :  {{item?.qty}}</p>
             <p style="color: black">Price :  {{item?.price}}
             <p class="pr" style="font-weight: bold; color: black">Total :</p><p class="pr" style="color: red"> {{item?.total}}</p>
          </ion-label>
        </ion-item>
      </ion-list>
      
      <h1>Total Price Here</h1>
      <button ion-button block clear>Place Order</button>

This is the transcript, Which also display the data from my firebase cart

 constructor(
    public navCtrl: NavController, 
    public navParams: NavParams,
    private ord: OrderListService) {

      this.orderList$ = this.ord
      .getOrderList() // DB List
      .snapshotChanges() // Key and Value
      .map(
        changes => {
          return changes.map(c => ({
            key: c.payload.key, ...c.payload.val()

Posts: 1

Participants: 1

Read full topic


Draw on canvas and merge it with video and save it together

$
0
0

@avishai_peretz_dev wrote:

I have an app which allow to draw on canvas with free hand paint.
And there is video playing behind the paint.
Is there any way to save the video with the paint data as video file?

Thanks

Posts: 1

Participants: 1

Read full topic

How to create ionic3 blog post

$
0
0

@gmagassa wrote:

Hello everyone, my name is ganda Magassa, I am a student. Since a few days I’ve been trying to create a blog post with ionic 3, but unfortunately I have a little problem. Here is my table post { name:string, description: string, picture: string}. I managed to save them but I can’t display the picture. Please I have some help from you

Posts: 1

Participants: 1

Read full topic

iOS post api is not working in real device

$
0
0

@Nirmalya-S wrote:

I have created a Ionic 3 Project in windows. Its works perfectly fine in Android. Then I copied the whole folder to Mac for iOS. I removed the plugins and platforms and reinstall it. It works fine as well. But the post Api request working fine in Safari (user agent iPhone) not in a real device(iPhone 6). I use “sudo ionic cordova build ios --buildFlag=-UseModernBuildSystem=0” to build the project.

Can anybody suggest what am I doing wrong?

Posts: 1

Participants: 1

Read full topic

Picture-In-Picture mode in Ionic?

Ionic 3 provider does not update

$
0
0

@nz1375sa wrote:

Hi, i am really new in ionic and i am working on an existing app. pages included in side menu of the app are defined in providers as : page-service.ts. i want to change titles of pages, i change their title in providers but when i run the app i see the old titles in the side menu. i have already changed page titles in all the html pages and it is fine but i have problem with the side menu titles.
the instruction of this provider page is :
import { Injectable } from ‘@angular/core’;
import {PageInterface} from “…/models/page-interface”;

@Injectable()
export class PageService {

pages: PageInterface = [
{ title: ‘Inicio’, pageName: ‘TabsPage’, tabComponent: ‘HomePage’, index: 0, icon: ‘icon_inicio.png’ },
{ title: ‘Perfil usuario’, pageName: ‘ProfilePage’, icon: ‘icon_perfil.png’ },
{ title: ‘Datos clínicos’, pageName: ‘MedicalDataPage’, icon: ‘icon_datos.png’ },
{ title: ‘Cerrar sesión’, pageName: ‘’, icon: ‘icon_logout.png’, logsOut: true },
];

public getPages() : PageInterface {
return this.pages;
}

}
and i am using:
Ionic Framework: 3.9.2
Ionic App Scripts: 3.1.11
Angular Core: 5.2.11
Angular Compiler CLI: 5.2.11
Node: 11.7.0
OS Platform: Windows 7
Navigator Platform: Win32

Posts: 2

Participants: 2

Read full topic

QRScanner prepare gives object is not a function error

$
0
0

@livingdigitaldemos wrote:

QRScanner prepare gives object is not a function error.
Getting a run time error Object(…) not a function.

Following is the code
import { Component } from ‘@angular/core’;
import { NavController } from ‘ionic-angular’;
import { QRScanner, QRScannerStatus } from ‘@ionic-native/qr-scanner/ngx’;

 @Component({
 selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {

  constructor(public navCtrl: NavController,private qrScanner: QRScanner) {

 }

startScan() {
console.log('Start Scan');

this.qrScanner.prepare()
  .then((status: QRScannerStatus) => {
    if (status.authorized) {
      // camera permission was granted
    } else if (status.denied) {
      // camera permission was permanently denied
      // you must use QRScanner.openSettings() method to guide the user to the settings page
      // then they can grant the permission from there
    } else {
      // permission was denied, but not permanently. You can ask for permission again at a later time.
    }
  })
  .catch((e: any) => console.log('Error is', e));

// this.qrScanner.scan();
// this.qrScanner.show();




// start scanning
// let scanSub = this.qrScanner.scan().subscribe((text: string) => {
//   console.log('Scanned something', text);

//   this.qrScanner.hide(); // hide camera preview
//   scanSub.unsubscribe(); // stop scanning
// });

}

}

I get this error on browser as well as android device

Posts: 1

Participants: 1

Read full topic

Hosting for nodejs and mongodb

$
0
0

@chakradharsw wrote:

Hello,
I am building an ionic app and for backend i am using nodejs and mongodb. Is there any budget friendly hosting services with support for both nodejs and mongodb.

Posts: 1

Participants: 1

Read full topic


Passing access token into app store install?

$
0
0

@r3mo wrote:

Hi All,

I have an ionic app that I plan to push to iOS and Android app stores. A website currently exists where users can log in (giving them an access token).

Ideally I would like to achieve a user flow where logged in users on the website can click a link to install the iOS/android app, with their access token string being passed as a parameter to App Store/Google Play store so that once they open the app, the app can automatically log them in using their access token from the website.

Questions:
[1] Is it possible to pass a parameter to the app stores and have access to this parameter on first launch?
[2] Is it secure (parameter sent over HTTPs) ?

Many thanks!

Posts: 1

Participants: 1

Read full topic

Publish ionic iOS App on BlackBerry UEM

$
0
0

@flo.riano wrote:

Hello Friends,

i’m new in ionic and developed an small App for our Company.
Now the App is Beta tested and we want to Publish the App with our Blackberry UEM Server.
We don’t have any problems with publishing an Android App (.apk) with the Server.
But we also tried it with an iOS App (.ipa) File.
The Upload to the UEM Server did not make any Problems.
But if any User want to install the App, it only shows an white App Icon (not ionic default icon) and the App did not start.
The .ipa File was created with xcode 10 on an Mac.
I have an Apple Developer Account activated.
What did i need to do to successful publish an iOS App with Blackberry UEM?
It’s not planned to Upload the App to the Apple Store.

Best Wishes
flo.riano

Posts: 1

Participants: 1

Read full topic

Ionic 4 - DevApp not fully functioning?

$
0
0

@sniii wrote:

Hi there

I’m currently a developer on a new large scale Ionic development project, and the solution is based on Ionic 4.
We are however experiencing issues with the use of the DevApp in conjunction with Ionic 4.

Here are our findings / issues:

  • Android: Cordova is not available, giving us problems with using Advanced HTTP plugin / CORS etc…
  • iOS: Cordova is available
  • General: No console output is being captured
  • General: Not possible to remote debug webview through Chrome or Safari

These issues are really making it hard to be productive as we are faced with a long and tedious debug turnaround time :sob:

Can you shed some light on when these bugs will be fixed?

Posts: 1

Participants: 1

Read full topic

Duplicate Fb_App_id when using account kit with facebook login

$
0
0

@manojpatel0217 wrote:

Getting duplication fb_app_id error when try to use facebook account kit with facebook login.

I tried to install facebook accountkit plugin without passing app id and app name but it looks like we need to must pass them and i pass them i am getting this error(As i already added facebook login plugin).

Following is the error.

[string/fb_app_name] D:\ionic\k-i4\platforms\android\app\src\main\res\values\accountkit.xml [string/fb_app_name] D:\ionic\k-i4\platforms\android\app\src\main\res\values\facebookconnect.xml: Error: Duplicate resources
[string/fb_app_id] D:\ionic\k-i4\platforms\android\app\src\main\res\values\accountkit.xml [string/fb_app_id] D:\ionic\k-i4\platforms\android\app\src\main\res\values\facebookconnect.xml: Error: Duplicate resources
:app:mergeDebugResources FAILED

FAILURE: Build failed with an exception.

  • What went wrong:
    Execution failed for task ‘:app:mergeDebugResources’.

[string/fb_app_name] D:\ionic\k-i4\platforms\android\app\src\main\res\values\accountkit.xml [string/fb_app_name] D:\ionic\k-i4\platforms\android\app\src\main\res\values\facebookconnect.xml: Error: Duplicate resources
[string/fb_app_id] D:\ionic\k-i4\platforms\android\app\src\main\res\values\accountkit.xml [string/fb_app_id] D:\ionic\k-i4\platforms\android\app\src\main\res\values\facebookconnect.xml: Error: Duplicate resources

  • 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

BUILD FAILED in 6s
21 actionable tasks: 1 executed, 20 up-to-date
cmd: Command failed with exit code 1 Error output:
FAILURE: Build failed with an exception.

  • What went wrong:
    Execution failed for task ‘:app:mergeDebugResources’.

[string/fb_app_name] D:\ionic\k-i4\platforms\android\app\src\main\res\values\accountkit.xml [string/fb_app_name] D:\ionic\k-i4\platforms\android\app\src\main\res\values\facebookconnect.xml: Error: Duplicate resources
[string/fb_app_id] D:\ionic\k-i4\platforms\android\app\src\main\res\values\accountkit.xml [string/fb_app_id] D:\ionic\k-i4\platforms\android\app\src\main\res\values\facebookconnect.xml: Error: Duplicate resources

Posts: 1

Participants: 1

Read full topic

Cordova plugin capture-plugin-media not working with android version 8 and 8.1 above

$
0
0

@vcass wrote:

After browsing it seems like it is problem with permission related problem. However I could not get proper solution working around with this plugin. Although it is working fine for android version below 7.

let options: CaptureImageOptions = { limit: 3 };
this.mediaCapture.captureImage(options)
.then(
(data: MediaFile) => console.log(data),
(err: CaptureError) => console.error(err)
);
}

In many cases it is written fixed. However in my case it is not working. The plugin suddenly crashes the app.

Posts: 1

Participants: 1

Read full topic

Custom Directive click HostListener not working in ionic 4

$
0
0

@Birke wrote:

i try to add a custom directive with a HostListener click. i generate a directive in ionic

import {Directive, ElementRef, HostListener} from '@angular/core';

@Directive({
    selector: '[appGoHome]'
})
export class GoHomeDirective {

    constructor() {
    }

    @HostListener('click') onClick() {
        console.log('Host Element Clicked');
    }

}

and this is my Element

<button appGoHome>test</button>

in app.modul the directive is set in declarations:

declarations: [AppComponent, RisHomeDirective],

But when i click on the Button, the directive is not firing? Whats wrong?

Posts: 2

Participants: 1

Read full topic

File import Problem


Google + close

$
0
0

@Ludolefrenchy wrote:

Hello
Attention google + will be closed from 2 April 2019 so no longer possible to use google sign-in.
if your app has the connection via google + it will remove it so you do not have a problem.

enjoy

Posts: 1

Participants: 1

Read full topic

How to return the position of my checkbox?

$
0
0

@Dunaan wrote:

Hello,

I would like to get the line where the checkbox is when I click on it.

HTML

<ion-row *ngFor="let ph of phrase">
      <ion-col class="{{ph.class}} col"><p>&nbsp; {{ph.contenu}}</p></ion-col>
      <ion-col class="{{ph.class}} col colCenter"><ion-checkbox id="C1" (click)="getLine('{{ph.line}}');"></ion-checkbox></ion-col>
      <ion-col class="{{ph.class}} col colCenter"><ion-checkbox id="C2"></ion-checkbox></ion-col>
      <ion-col class="{{ph.class}} col colCenter"><ion-checkbox id="C3"></ion-checkbox></ion-col>
      <ion-col class="{{ph.class}} col colCenter"><ion-checkbox id="C4"></ion-checkbox></ion-col>
      <ion-col class="{{ph.class}} col colCenter"><ion-checkbox id="C5"></ion-checkbox></ion-col>
    </ion-row>

TS

  public getLine(line : string){
    alert(line);
  }

But the app tells me : “Error : Got interpolation ({{}}) where expression was expected…”
I don’t really understand what is the way to get back the line stocked into ph with an other method.

Thank you by advance for any help.

Posts: 1

Participants: 1

Read full topic

Show push notification inside the app

$
0
0

@lsantaniello wrote:

I integrated OneSignal platform in my application. I successfully receive the push notifications but I’d like to show the notifies the the same layout for external and internal notifies of the app.

When I’m in the app and I receve the notify, The simple alert has been showed (similar to javascript alert).
When I’m out of the app and I receive the notify, the classic notify appears.

How can I integrate the same layout inside the app? Could you please support me?

console.log("Cordova is available. PUSH Enabler has bean enabled");

      var notificationReceidedCallback = function (jsonData) {
        console.log(jsonData);
        console.log('notificationReceidedCallback: ' + JSON.stringify(jsonData));
      };

      var notificationOpenedCallback = function (jsonData) {
        console.log(jsonData);
        console.log('notificationOpenedCallback: ' + JSON.stringify(jsonData));
      };

      window["plugins"].OneSignal
        .startInit(FIREBASE_APP_ID, FIREBASE_SENDER_ID)
        .handleNotificationOpened(notificationOpenedCallback)
        .handleNotificationReceived(notificationReceidedCallback)
        .endInit();

Thanks
Luca

Posts: 1

Participants: 1

Read full topic

[Ionic 4] Checking network status over Browser

$
0
0

@rodrigojrmartinez wrote:

Hi Guys

I’m developing an ionic 4 app where I need to keep track of the current network status and notify the user whenever the status changes. The app should be supported on browser besides mobile devices, so after checking a while I’ve learned that when on mobile, the Network cordova plugin in should be used. This works just excellent! My problem starts when having to detect this at browser level.

Basically, what I do is to wait for the platform to be ready, check where I’m at, and based on this listen for the proper events besides checking the status at that point, something like.

constructor(platform: Platform, network: Network) {
   this.platform.ready().then(() => {
      if (this.platform.is('cordova')) {
          // this is ok
          this.listenForDeviceNetwork();
      } else {
          this.listenForBrowserNetwork();
     }
   });
}

private listenForBrowserNetwork(){
    // also tried with document!
    window.addEventListener('offline', () => { console.log('now you are offline!'); });
    window.addEventListener('online', () => { console.log('now you are online!'); });
     this.isOnline = navigator.onLine;
}

The problem I’m facing is that the navigator.onLine is always returning true, and the events are never fired. Tryied taking out the internet connection as well as setting to the airplane mode, but noting… Also tried to log the navigator.onLine with an interval and check its value, but it is always returning true

setInterval(() => {
    console.log('now ', navigator.onLine);
}, 200);

This anyone stumbled across this problem? Thanks for the time!

Posts: 1

Participants: 1

Read full topic

Ionic dashboard - how to specify version of node when building package

$
0
0

@moomoomamoo wrote:

On the Ionic dashboard, I’ve been building packages for iOS and android. During the build package process, it used to use node 8 (which is what my team is currently using at our workstations). The build package process has been successful.

Now it appears that the build package process uses node 10, and now we’re getting some errors. Is there a way for us to specify which version of node we want for the build package process?

To be clear, I’m not looking for help on resolving the errors I get when it’s using node 10, I’m just asking on how to make it use node 8 instead of node 10.

Posts: 1

Participants: 1

Read full topic

Viewing all 48981 articles
Browse latest View live


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