Quantcast
Channel: Ionic Forum - Latest posts
Viewing all 228529 articles
Browse latest View live

Upload files(images and pdf) to firebase from browser

$
0
0

Hello, do you have any solutions yet? please share


Getting pdf data from input and uploading firebase

$
0
0

I’m new to ionic+angular. I have the following code below for uploading pdf’s to firebase but it does not work. Is that the right way of getting the data from pdf? The code was copied from someone online for uploading images and I tried to modify it for pdfs.

 <input type="file" id="getFile" accept="application/pdf" [(ngModel)]="this.ChoosenPDF">

  upload() {
    if (this.ChoosenPDF) {
      const uploadTask = firebase.storage().ref().child('pdf/mypdf.pdf')
        .put(this.ChoosenPDF);
      uploadTask.then(this.onSuccess, this.onError);
    }
  }

  onSuccess = snapshot => {
    this.ChoosenPDF = snapshot.downloadURL;
    console.log("success");
  };
  
  onError = error => {
    console.log("error", error);
  };

Set ion-datetime default to device time

Need help while trying to run ng serve

$
0
0

What is this and from whom did you buy it?

Service not performing as singleton despite provided in root

$
0
0

I personally am not a fan of providedIn: 'root' because it prevents mocking, so I would try getting rid of it and seeing if anything changes.

How do we bind values to

$
0
0

What happens if you take the second parameter completely out of the setValue call?

Can't bind to 'ngModel' since it isn't a known property of

$
0
0

I am getting this error even if I have already put FormsModule on the app.module.ts.

import { FormsModule, ReactiveFormsModule } from '@angular/forms';
imports: [
    BrowserModule,
    IonicModule.forRoot(),
    AppRoutingModule,
    FormsModule,
    ReactiveFormsModule 
  ],

<ion-input type="text" [(ngModel)]="nome" formControlName="nome" name="nome" required></ion-input>

Can't bind to 'ngModel' since it isn't a known property of

$
0
0

You don’t want both ngModel and formControlName. Choose one.


Google Analytics - which plugin?

$
0
0

I think first decision you need is do you want to go with a hybrid plugin (cordova for ex) or with pure web sdk for GA.

Then you could pick one that suits. Google actually finalizes the merger of their GA suite with Firebase suite -> so you can use either and soon it will be just one.

Cause of that merger I opted for AngularFire’s latest 5.3.0 which now supports GA as a web SDK.

Can't bind to 'formGroup' since it isn't a known property of 'form'. problem

$
0
0

I am getting this error even though I am doing everything accordingly.

import { FormsModule, ReactiveFormsModule } from '@angular/forms';

imports: [
    BrowserModule,
    IonicModule.forRoot(),
    AppRoutingModule,
    FormsModule,
    ReactiveFormsModule 
  ],


import { FormsModule, ReactiveFormsModule, Validators, FormBuilder, FormGroup, FormControl } from '@angular/forms';

inscricaoForm;

  constructor(formBuilder: FormBuilder) {

    this.inscricaoForm = formBuilder.group({

      dataInscricao: ['', Validators.required],

      nome: ['', Validators.required],

      endereco: ['', Validators.required]

    });

  }
  <form [formGroup]="inscricaoForm">

<ion-input type="text" formControlName="nome" name="nome" required></ion-input>

Draw over other Apps

$
0
0

Hey, can you describe this use case in more details?

WKWebView in Ionic

$
0
0

So there is the webview that your application will use to render your app and there is “in-app-browser” webview, which is a webview that gets nested into your main webview.

Which one do you mean?

Can't bind to 'formGroup' since it isn't a known property of 'form'. problem

$
0
0

This is a difficult proclamation to make under the most favorable of conditions, and the fact that the framework is throwing errors makes it much more so. We (myself included) often think we’re doing everything appropriately, because otherwise we would do things differently. This is why it makes things go so much more smoothly when people post links to complete minimal repositories that allow others to recreate their problem, as opposed to disembodied snippets of code.

I suspect you are lazily loading modules for components, and failing to import ReactiveFormsModule into the modules hosting said components. It doesn’t magically jump from the app module.

WKWebView in Ionic

$
0
0

I would like to use the webview so it would look like its part of the app.

$segment-button-ios-text-color not changing?

$
0
0

WOWWWW very nice!

asdf


Detect Screen Orientation

$
0
0

Hi!

1. What do I want to achieve?
I want to render (or navigate) a user to the right screen based on his device screen/device orientation.

2. What platform are you using? iOS or Android? Android
3. What OS environment? Windows, Linux, MacOS? Linux (Ubuntu)
4. Have you received an error or is it just not working? Just not working.
5. Cordova version if you have already wrapped your app?

  • Ionic version: 5.4.4
  • Cordova version: 9.0.0 (cordova-lib@9.0.1)

My attempts to detect screen orientation:

1. W3C Device Orientation API (as described here)

ngOnInit() {
  window.addEventListener("deviceorientation", e => console.log(e))
}
  • This works and I get new absolute, alpha, beta, and gamma whenever device orientation changes.
  • What is different from what I read in the docs is that I never get negative values for alpha, beta, gamma, absolute no matter how the device is oriented.
  • I’m not sure how to derive if a device is in landscape or portrait mode from the data I get from deviceorientation event listener

2. Cordova Screen Orientation API (as described here)

ngOnInit() {
    this.screenOrientation.onChange().subscribe(() => {
      console.log("Orientation Changed");
    });
}
  • this.screenOrientation.onChange() never got called even if I rotated an emulator
  • it got called if I manually locked new orientation (I think this is expected behaviour, but I’m unsure of how to find out the correct device orientation) like this:
  ngOnInit() {
    this.screenOrientation.onChange().subscribe(() => {
      console.log("Orientation Changed");
    });
    setTimeout(() => {
      this.screenOrientation.lock(
        this.screenOrientation.ORIENTATIONS.PORTRAIT
      );
    }, 10000);

3. I also tried to compare window.innerWidth and window.innerHeight and derive screen orientation from that. But the values never changed no matter what the position of an emulator was.

private window = window;
  ngOnInit() {
    window.addEventListener("deviceorientation", e => {
     if(window.innerHeight > window.innerWidth){
       // lock portrait using Cordova screen orientation plugin
     }else{
      // lock landscape using Cordova screen orientation plugin
     }
}

Need help while trying to run ng serve

Detect Screen Orientation

$
0
0

I’m able to distinguish between landscape-primary and landscape-secondary when rotating the emulator with the following code:

  ngOnInit() {
    this.platform.ready().then(() => {
      this.screenOrientation.onChange().subscribe(() => {
        console.log(this.screenOrientation.type); // This logs either landscape-primary or landscape-secondary
      });
      this.screenOrientation.lock(
        this.screenOrientation.ORIENTATIONS.LANDSCAPE
      );
    });

But I’m still unable to distinguish between landscape and portrait.

I think this behaviour is really strange as the only rotation changes I detect are the ones made for 180 degrees. In docs clearly says that rotations made for 180degrees are the ones that should NOT be recognized. WTF?

Ionic SetUp

$
0
0

The CLI that does the building and is therefore sensitive to environmental things like node versions and whatnot is independent of the framework version. The same modern CLI you would install globally is capable of working on framework v3 apps, so I would suggest simply not worrying about any of this and just going with what npm i -g ionic gives you. In general, I recommend the latest LTS of node.

HTTP Get Requests (Wordpress website Rest API calls) not working in iOS App

$
0
0

My Ionic4 App (with angular) is published in both PlayStore (Android) and App Store (iOS). App is expected to show latest articles from https://thesosial.org/ website. App makes http get request to fetch json data (calling the wordpress rest api at url https://thesosial.org/wp-json/wp/v2/posts). Sample code from page ts file:

import { HttpClient} from ‘@angular/common/http’;

this.http.get(url).pipe(map(res => {return res}));

My app is working fine in Android but failing to display content in iOS device.

Apple support team is unable to help as they only look into swift code. For Ionic code, they are suggesting to get help from Ionic community experts. This issue has blocked our release and became a show stopper for us. Request you to help us resolving this issue at the earliest.

In case there is any other channel/option to get faster service from Ionic experts, kindly suggest.

iOS app link is https://apps.apple.com/us/app/the-sosial/id1492790435?ls=1
Android app link is https://play.google.com/store/apps/details?id=com.binacraft.strsosial

Regards,
Nanda Kishore

Viewing all 228529 articles
Browse latest View live