Quantcast
Channel: Ionic Forum - Latest topics
Viewing all 71529 articles
Browse latest View live

How to convert my php code to use in ionic3 project

$
0
0

@DrNVS wrote:

I am learning ionic3
I have some working code in php
The below code is working properly in html website.

````


    <?php 
 
function date_picker($name, $startyear=NULL, $endyear=NULL)
{
    if($startyear==NULL) $startyear = date("Y")-2;
    if($endyear==NULL) $endyear=date("Y"); 

    $months=array('','January','February','March','April','May',
    'June','July','August', 'September','October','November','December');

    // Month dropdown
    $html="<select name=\"".$name."month\">";

    for($i=1;$i<=12;$i++)
    {
	   $html.="<option ";
	   if (is_array($_POST) && array_key_exists('deathmonth', $_POST))
	   {
		   if ($i ==  $_POST['deathmonth'])
		   {
			   $html.="selected";
		   }
	   }
	   else
	   {
	   		if($i == date('m')) $html.="selected";
	   }
	   $html.=" value='$i'>$months[$i]</option>";	   
    }
    $html.="</select> ";
   
    // Day dropdown
    $html.="<select name=\"".$name."day\">";
    for($i=1;$i<=31;$i++)
    {
       $html.="<option ";
	   if (is_array($_POST) && array_key_exists('deathday', $_POST))
	   {
		   if ($i ==  $_POST['deathday'])
		   {
			   $html.="selected";
		   }
	   }
	   else
	   {
	   		if($i == date('d')) $html.="selected";
	   }
	   $html.=" value='$i'>$i</option>";
    }
    $html.="</select> ";

    // Year dropdown
    $html.="<select name=\"".$name."year\">";

    for($i=$startyear;$i<=$endyear;$i++)
    {      
       $html.="<option ";
	   if (is_array($_POST) && array_key_exists('deathyear', $_POST))
	   {
		   if ($i ==  $_POST['deathyear'])
		   {
			   $html.="selected";
		   }
	   }
	   else
	   {
	   		if($i == date('Y')) $html.="selected";
	   }
	   $html.=" value='$i'>$i</option>";
    }
    $html.="</select> ";
	
    return $html;
}
?>
<span style="color: #00F">Select the date of death and click Get Dates</span>
<?php
	echo date_picker("death");
?>
<input type="submit" name="submit" value="Get Dates"/> 
</form>
    
<?php
if(count($_POST) > 1)
{
$datefield = $_POST['deathday'] . "-" . $_POST['deathmonth'] . "-" . $_POST['deathyear'];
echo '<span style="color: #00F">The date you have selected is : <b>' . $datefield . '</b></span><br>' . '</tr><tr><td>';


$date1  = date('d-m-Y', strtotime( $datefield . "+27 days")) . "<br>";
$date2  = date('d-m-Y', strtotime( $datefield . "+40 days")) . "<br>";
$date3  = date('d-m-Y', strtotime( $datefield . "+170 days")) . "<br>";
$date4  = date('d-m-Y', strtotime( $datefield . "+340 days")) . "<br>";

//date_add($date1, date_interval_create_from_date_string('27 days'));
//date_add($date2, date_interval_create_from_date_string('40 days'));
//date_add($date3, date_interval_create_from_date_string('170 days'));
//date_add($date4, date_interval_create_from_date_string('340 days'));
echo '<div style="font-family: Comic Sans MS; font-size:14px; color: #0000FF; ine-height:26px; background-color:#C6FFFF0;">';
echo "General Conditions : If possible avoid eldest kartha's jenma star, then Tuesday - Saturday - Friday (in this order)<hr>";
echo "27th Oonam : <b>" . $date1 . "</b><br>";
echo "We have given 28th day, it can be performed either on 28th or on 29th day. <br>";
echo "It can be performed on 30th day if thithi maasikam does not occur. <br><hr>";
echo "45th Oonam : <b>" . $date2 . "</b><br>";
echo "We have given 41st day, it can be performed on any one day from 41st to 45th day. <br><hr>";
echo "6th month Oonam : <b>" . $date3 . "</b><br>";
echo "We have given 171st day, it can be performed on any one day from 171st to 180th day. <br><hr>";
echo "Oona aapthikam : <b>" . $date4 . "</b><br>";
echo "We have given 341st day, it can be performed on any one day from 341st to 355th day. <br><hr>";
echo "General conditions are applicable for all the four oonams. <br>";
}
?>

I wish to use this code in my new ionic3 app
please help with ts and html to show up.

I tried many ways to do this and searched through google and I could not find a solution to do this. It is very difficult to post a question also here.

Posts: 1

Participants: 1

Read full topic


How to make notifications in a sameline with sidebar?

Black background appears after QRScanner calls hide and destroy

Two splash screen showing first from android and then ionic capacitor

$
0
0

@talhax wrote:

I am using capacitor With IONIC 4 ,
On android devices The splash screen loading two times.First from android and then Ionic Capacitor.
How can i fix this problem.

Posts: 1

Participants: 1

Read full topic

Faster Creation of ionic Project

$
0
0

@arulyan wrote:

I was wondering if there’s any faster way of creating projects in ionic3 since downloading node modules takes a lot of time as its size is bigger than the rest. Therefore I was thinking if we can copy the node modules file from another project and paste it in our current project before running the command:

ionic start myapp

So that the project can be created faster… Is this possible? Is there any other faster way?

Posts: 1

Participants: 1

Read full topic

Localised ionic list scrolling

$
0
0

@aminemarref wrote:

Hello,

I have a long ion-list inside an ion-card, and to fully-display it, some scrolling is needed. How do I make the scrolling happen inside the card alone i.e. all other parts of the UI remain immobile during scrolling?

The following code illustrates my problem.

<ion-app>
  <ion-router-outlet></ion-router-outlet>
  <ion-header>
    <ion-toolbar color="primary">
      <ion-title>My App</ion-title>
    </ion-toolbar>
  </ion-header>
  <ion-content>
    <ion-card>
      <ion-card-header>
        <ion-card-title>Card 1</ion-card-title>
      </ion-card-header>
      <ion-card-content>
        Card 1 Content
      </ion-card-content>
    </ion-card>
    <ion-card>
      <ion-card-header>
        <ion-card-title>Card 2</ion-card-title>
      </ion-card-header>
      <ion-card-content>
        <ion-list-header>Chips Group 1</ion-list-header>
        <p>
          <ion-chip color="light">
            <ion-label>Chip 1.1</ion-label>
          </ion-chip>
          <ion-chip>
            <ion-icon name="checkmark-circle"></ion-icon>
            <ion-label>Chip 1.2</ion-label>
          </ion-chip>
          <ion-chip>
            <ion-label>Chip 1.3</ion-label>
          </ion-chip>
        </p>
        <ion-list-header>Chips Group 2</ion-list-header>
        <p>
          <ion-chip color="light">
            <ion-label>Chip 2.1</ion-label>
          </ion-chip>
          <ion-chip>
            <ion-icon name="checkmark-circle"></ion-icon>
            <ion-label>Chip 2.2</ion-label>
          </ion-chip>
          <ion-chip>
            <ion-label>Chip 2.3</ion-label>
          </ion-chip>
        </p>
        <ion-list-header>Chips Group 3</ion-list-header>
        <p>
          <ion-chip color="light">
            <ion-label>Chip 3.1</ion-label>
          </ion-chip>
          <ion-chip>
            <ion-icon name="checkmark-circle"></ion-icon>
            <ion-label>Chip 3.2</ion-label>
          </ion-chip>
          <ion-chip>
            <ion-label>Chip 3.3</ion-label>
          </ion-chip>
        </p>
        <ion-list-header>Chips Group 4</ion-list-header>
        <p>
          <ion-chip color="light">
            <ion-label>Chip 4.1</ion-label>
          </ion-chip>
          <ion-chip>
            <ion-icon name="checkmark-circle"></ion-icon>
            <ion-label>Chip 4.2</ion-label>
          </ion-chip>
          <ion-chip>
            <ion-label>Chip 4.3</ion-label>
          </ion-chip>
        </p>
        <ion-list-header>Chips Group 5</ion-list-header>
        <p>
          <ion-chip color="light">
            <ion-label>Chip 5.1</ion-label>
          </ion-chip>
          <ion-chip>
            <ion-icon name="checkmark-circle"></ion-icon>
            <ion-label>Chip 5.2</ion-label>
          </ion-chip>
          <ion-chip>
            <ion-label>Chip 5.3</ion-label>
          </ion-chip>
        </p>
        <ion-list-header>Chips Group 6</ion-list-header>
        <p>
          <ion-chip color="light">
            <ion-label>Chip 6.1</ion-label>
          </ion-chip>
          <ion-chip>
            <ion-icon name="checkmark-circle"></ion-icon>
            <ion-label>Chip 6.2</ion-label>
          </ion-chip>
          <ion-chip>
            <ion-label>Chip 6.3</ion-label>
          </ion-chip>
        </p>
      </ion-card-content>
    </ion-card>
  </ion-content>
</ion-app>

If I swipe down, the whole UI gets swiped. I want the card Card 1 to remain fixed while the list items are scrolled inside Card 2.

I am super new to web development, and I could not achieve the desired result by wrapping the cards inside HTML <div>s.

Thanks,
Amine.

Posts: 1

Participants: 1

Read full topic

How To Multiple Tabs In The Same Page?

[Ionic 4] FileTransfor for many images

$
0
0

@TiagoPaza wrote:

I am developing an application for salespeople in a store. They will need to have the products offline to sell because in some places there is no network, I set up a JSON on my back end that brings all the products. I am writing this JSON with file.write to query if there is no network to fetch the JSON products I inserted.

But I need to scan this JSON and get the links of the images that are in them, and save the device too, the problem It’s just too many images and result is crash application.

I’m using filetransfer to download images, how can I download without crash?

My code:

response.products.forEach(item => {
   item.midias.forEach(media => {
       this.writeImages(media.id_registro, media.imagem_produto);
  });
});

...

public writeImages(id: number, fileName: string) {
    const fileTransfer: FileTransferObject = this.fileTransfer.create();
    const url = `https://cartoesbellaarte.com.br/admin/views/_uploads/${fileName}`;

    fileTransfer.download(url, this.file.applicationDirectory + `/images/${id}/${fileName}`).then(async (entry) => {
        const toast = await this.toast.create({
             message: entry.toURL(),
             position: 'bottom',
             duration: 3000
        });
        toast.present();

    }, (error) => {
        alert('Err on insert: ' + error.error);
    });
}

Posts: 1

Participants: 1

Read full topic


Fail to build ios for blank app

$
0
0

@yundongcai1983 wrote:

Dear all,

I need help to build the ionic app to ios.
I create a blank ionic project, and build to ios, get the following error.

> ionic start Test
> cd Test
> ionic cordova platforms add ios
> ionic build ios

ionic version: 5.2.3
node version: v12.7.0
ios platform version: ios 4.5.5

> cordova build ios
(node:58377) UnhandledPromiseRejectionWarning: TypeError: Cannot read property 'name' of undefined
    at /Users/caiyundong/Desktop/project/ionic/Test/platforms/ios/cordova/lib/build.js:130:60
    at _fulfilled (/Users/caiyundong/Desktop/project/ionic/Test/platforms/ios/cordova/node_modules/q/q.js:854:54)
    at /Users/caiyundong/Desktop/project/ionic/Test/platforms/ios/cordova/node_modules/q/q.js:883:30
    at Promise.promise.promiseDispatch (/Users/caiyundong/Desktop/project/ionic/Test/platforms/ios/cordova/node_modules/q/q.js:816:13)
    at /Users/caiyundong/Desktop/project/ionic/Test/platforms/ios/cordova/node_modules/q/q.js:624:44
    at runSingle (/Users/caiyundong/Desktop/project/ionic/Test/platforms/ios/cordova/node_modules/q/q.js:137:13)
    at flush (/Users/caiyundong/Desktop/project/ionic/Test/platforms/ios/cordova/node_modules/q/q.js:125:13)
    at processTicksAndRejections (internal/process/task_queues.js:75:11)
(node:58377) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 1)
(node:58377) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

Thank you so much for your kind suggestion.

Posts: 1

Participants: 1

Read full topic

Can't turn sound off, vibration on, and set badge to 0 in Local Notifications

$
0
0

@hanigb wrote:

I have the local notification below and everything works as expected except the sound is not turning off if I set the property to null, the vibration is not working if I set the property to true, and the badge is not being removed if I set the property to 0.

this.localNotifications.schedule({
id: 1,
sound: null,
vibrate: true,
badge: 0,
icon: ‘file://assets/icon.png’,
title: this._assistant.getAssistantName() + ’ مستعدة! ',
sticky: true,
});

Using:
@ionic-native/local-notifications”: “^5.11.0”,
“cordova-plugin-local-notification”: “0.9.0-beta.2”.

Thanks.

Posts: 1

Participants: 1

Read full topic

Iframe and ionic 4

$
0
0

@amarjitsingh wrote:

I am trying to launch website using iFrame from ionic4 angular mobile app. It is not working for ios and there is no error message either. Do we have any example which i can use for ionic 4.

Posts: 1

Participants: 1

Read full topic

Android Hardware Back Button Problem

$
0
0

@LacOniC wrote:

I published my app’s first version in last month. I haven’t added any additional code and android hardware back button was working. Then i updated package.json several times to latest versions of angular, cordova and ionic. Now it’s not working.

Is there any known problem about a package version that prevents android hardware back button?

Btw, i tried downgrade with old package.json. Still does not work. I upgraded global Gradle version to 5.5.1. Maybe problem is gradle versions? Because Ionic use Android Gradle Plugin 3.3.0 but Gradle 5.5.1 is for 3.4.0+.

51

Thanks in advance.

Posts: 1

Participants: 1

Read full topic

Stripe Checkout Keyboard hides button

$
0
0

@wekas wrote:

I am using the Stripe check https://checkout.stripe.com/checkout.js.
It works fine for Angular projects and ok for Ionic on an Android device but on iOS the keyboard blocks the payment button and the user cannot continue.
If the user clicks anywhere else on the screen it does not hide the keyboard.
Also scrolling the form up or down does not work as it is fixed.

Anyone had to deal with this?

Posts: 1

Participants: 1

Read full topic

How to solve CORS issue while accessing any REST API

$
0
0

@khushaly wrote:

Used both Native http plugin, HTTPClient but CORS issue is not resolved for accessing API’s,
Do you have any idea…

Posts: 1

Participants: 1

Read full topic

Upgrading from angularjs+ionic-v1+cordova to angular7+ionic4+ionic-native

$
0
0

@muratdemirsoy wrote:

Hi i’m coming from C++ world and new to web/mobile development.

i got a mobile app created using angularjs and ionic-v1 and cordova and i want to upgrade it to the latest available frameworks.

i’ve read angularjs-angular upgrade tutorial at https://angular.io/guide/upgrade but it doesn’t give me a clue about how to upgrade ionic at the same time.

For example, i couldn’t manage to import ‘ionic’ module as a dependency to an angularjs module (i’m trying to use webpack as the module loader).

i’ve tried all of the following one by one:
import * as ionic from ‘@ionic/angular’;
import * as ionic from ‘@ionic/core’;
import * as ionic from ‘ionic-angular’;

an got the following:

Blockquote
“Module ‘ionic’ is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.”

when i try this:
import * as ionic from ‘ionic’;

i get many errors like the following:

Blockquote
./node_modules/ionic/lib/integrations/cordova/android.d.ts 1:7
Module parse failed: Unexpected token (1:7)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
export declare function getAndroidSdkToolsVersion(): Promise<string | undefined>;
| export declare function locateSDKHome(): Promise<string | undefined>;
| export declare function parseSDKVersion(contents: string): Promise<string | undefined>;

my angularjs module is defined as follows:

// import stuff…

const app = angular.module(‘ionicApp’, [‘ionic’, ‘ngRoute’])
.run([’$rootScope’, ‘$ionicPlatform’, ‘dataProvider’, ‘$ionicHistory’, function($rootScope, $ionicPlatform, dataProvider, $ionicHistory) {
$ionicPlatform.ready(function() {

}
});

does what i am trying to do make any sense or am i trying to do something terribly wrong?

what is the correct/easiest way to approach upgrading my app?:

  • should i upgrade ionic1 to ionic4 first and then upgrade angularjs to angular?
  • or upgrade angularjs to angular first and then ionic1 to ionic4?

Posts: 1

Participants: 1

Read full topic


Ion-menu does not appear

$
0
0

@axs96mmy775swm4q wrote:

I’ve created an side-menu as a component which looks like this:

import { Component, OnInit } from '@angular/core';
import { MenuController } from '@ionic/angular';

@Component({
  selector: 'app-side-menu',
  templateUrl: './side-menu.component.html',
  styleUrls: ['./side-menu.component.scss'],
})
export class SideMenuComponent implements OnInit {

  constructor(private menu: MenuController) { }

  ngOnInit() {
    this.menu.enable(true, 'first');
  }

  openFirst() {
    this.menu.open('first');
  }

}

My side-menu.component.html looks like:

<ion-menu side="start" menuId="first">
  <ion-header>
    <ion-toolbar color="primary">
      <ion-title>Start Menu</ion-title>
    </ion-toolbar>
  </ion-header>
  <ion-content>
    <ion-list>
      <ion-item>Menu Item</ion-item>
      <ion-item>Menu Item</ion-item>
      <ion-item>Menu Item</ion-item>
      <ion-item>Menu Item</ion-item>
      <ion-item>Menu Item</ion-item>
    </ion-list>
  </ion-content>
</ion-menu>

<ion-router-outlet main></ion-router-outlet>

On any page, I try to use it like this:
this.sideMenu.openFirst();
Header on the html of the page looks like:

<ion-buttons slot="start">
			<ion-menu-button autoHide="false" (click)='openMenu()'></ion-menu-button>
		</ion-buttons>
		<ion-title>
			{{pageTitle}}
		</ion-title>

The icon with three bars appears, but nothing happens at all, when clicking.
The open-event is fired

Posts: 1

Participants: 1

Read full topic

How to compare the selected value of ion-select selected value in numbere

$
0
0

@DrNVS wrote:

What I am doing wrong?
html

<ion-item>
    <ion-label>Select Your Star</ion-label>
    <ion-select [(ngModel)]="item" (ionChange)="selectionChanged($event)" placeholder="Select One">
      <ion-select-option *ngFor="let x of sets" value="{{x.setno}}">{{x.stars}}</ion-select-option>


    </ion-select>
  </ion-item>

  <h3>{{dv}}</h3>
  <h3>{{suitable}}</h3>

.ts

import { Component } from '@angular/core';
import { HttpClient } from '@angular/common/http';

@Component({
  selector: 'app-home',
  templateUrl: 'home.page.html',
  styleUrls: ['home.page.scss'],
})
export class HomePage {

  sets = [
    {
      setno: 1,
      stars: 'Aswini, Makam, Moolam',
    },
    {
      setno: 2,
      stars: 'Barani, Pooram, Pooradam',
    },
    {
      setno: 3,
      stars: 'Karthigai, Uthram, Uthradam', 
    },
    {
      setno: 4,
      stars: 'Rohini, Hastham, Thiruvonam',
    },
    {
      setno: 5,
      stars: 'Mirugasir, Chithrai, Avittam',
    },
    {
      setno: 6,
      stars: 'Thiruvadirai, Swathi, Sathayam',
    },
    {
      setno: 7,
      stars: 'Punarpusam, Visakam, Poorattathi',
    },
    {
      setno: 8,
      stars: 'Poosam, Anusham, Uthrattadhi',
    },
    {
      setno: 9,
      stars: 'Ayilyam, Kettai, Revathi'
    }


  ];

  // stars= [1, 2, 3, 4, 5, 6, 7, 8, 9]
  // mydate = new Date(Date.now()).toISOString().split('T')[0];
  constructor() {}
  
  item = '';
  dv = '';
  suitable = '';
  selectionChanged(ev) {
    console.log('changed', ev.value);
    console.log(this.item);
    this.dv = this.item;
     }
     getSuitableStars(dv) {
      switch (dv)
      {
      case (1):
        this.suitable = '2, 4, 6, 8, 9';
        break;
        case(2):
        this.suitable = '1, 3, 5, 7, 9';
        break;
        case(3):
        this.suitable = '1, 2, 4, 6, 8';
        break;
        case(4):
        this.suitable = '2, 3, 5, 7, 9';
        break;
        case(5):
        this.suitable = '1, 3, 4, 6, 8';
        break;
        case(6):
        this.suitable = '2, 4, 5, 7, 9';
        break;
        case(7):
        this.suitable = '1, 3, 5, 6, 8';
        break;
        case(8):
        this.suitable = '2, 4, 6, 7, 9';
        break;
        case(9):
        this.suitable = '1, 3, 5, 7, 8';
        break;

        default:
          this.suitable = 'Not applicable';
          break;
      }
      return this.suitable;
      }
  }
  

Also I wish to give the details from the sets [ …] instead of the numbers in the case statement.
Please help.

Posts: 1

Participants: 1

Read full topic

Ionic 4, Only on iOS - click on button with icon working only on icon

$
0
0

@Baharis87 wrote:

Problem: Ionic 4, Only on iOS - click on button with icon working only on icon. In Header.

Hi,
Browser and Android works normally.But on an iOS device, the click takes effect only when the icon is clicked. Not the whole button with padding.
This is also a problem with the ion-menu-button.
Some idea?

<ion-header>
	<ion-toolbar class="header-background">
		<ion-buttons slot="start">
			<ion-menu-button color="light" ></ion-menu-button>
		</ion-buttons>
		<ion-title>{{'MAPOFMOORINGS.TITLE'|translate}}</ion-title>
		<ion-buttons slot="end">
			<ion-button (click)='toggleSearch()' color="light">
				<ion-icon slot="icon-only" name="search"></ion-icon>
			</ion-button>
			<ion-button (click)='choosePosition()' color="light">
				<ion-icon slot="icon-only" name="locate"></ion-icon>
			</ion-button>
		</ion-buttons>
	</ion-toolbar>
</ion-header>
"@angular/common": "^7.2.15",
    "@angular/core": "^7.2.15",
    "@angular/forms": "^7.2.15",
    "@angular/http": "^7.2.15",
    "@angular/platform-browser": "^7.2.15",
    "@angular/platform-browser-dynamic": "^7.2.15",
    "@angular/router": "^7.2.15",
    "@ionic-native/admob-pro": "^5.11.0",
    "@ionic-native/base64": "^5.10.0",
    "@ionic-native/camera": "^5.10.0",
    "@ionic-native/core": "^5.10.0",
    "@ionic-native/google-maps": "^5.5.0",
    "@ionic-native/image-picker": "^5.10.0",
    "@ionic-native/ionic-webview": "^5.10.0",
    "@ionic-native/splash-screen": "^5.10.0",
    "@ionic-native/status-bar": "^5.10.0",
    "@ionic/angular": "^4.7.1",
    "@ionic/storage": "^2.2.0",
    "@mauron85/cordova-plugin-background-geolocation": "3.0.3",
    "@ngx-translate/core": "^11.0.1",
    "@ngx-translate/http-loader": "^4.0.0",
    "ajv": "^6.10.2",
    "com-badrit-base64": "0.2.0",
    "cordova-android": "8.0.0",
    "cordova-browser": "6.0.0",
    "cordova-plugin-admobpro": "2.37.2",
    "cordova-plugin-camera": "4.0.3",
    "cordova-plugin-device": "^2.0.2",
    "cordova-plugin-extension": "1.5.4",
    "cordova-plugin-googlemaps": "git+https://github.com/mapsplugin/cordova-plugin-googlemaps.git#multiple_maps",
    "cordova-plugin-ionic-keyboard": "^2.1.3",
    "cordova-plugin-ionic-webview": "^4.1.0",
    "cordova-plugin-splashscreen": "^5.0.2",
    "cordova-plugin-statusbar": "^2.4.2",
    "cordova-plugin-telerik-imagepicker": "^2.2.4",
    "cordova-plugin-whitelist": "^1.3.3",
    "core-js": "^2.6.9",
    "lodash": "^4.17.15",
    "normalize-diacritics": "^1.0.2",
    "rxjs": "^6.5.2",
    "zone.js": "~0.8.29"

Posts: 1

Participants: 1

Read full topic

Ionic 4 = Backend binary image

$
0
0

@mtnoronha7 wrote:

I have to request a binary image from a server, but I need extra headers and authorization. Thus I can only do this on the backend. After I receive the image using ionic native HTTP, I’ve tried to display the image several times, but none worked.

1) I tried setting the binary data to a field like this:

    this.unit.img(this.unitInfo.logo).then( (r) => {
      this.logo = r.data;
    }

And on html:

  <ion-img [src]="logo"></ion-img>

2) I also tried converting the img to a base64 img, like this:

 this.unit.img(this.unitInfo.logo).then( (r) => {
      var imageData = btoa(r.data);
      this.logo = "data:image/png;base64,"+imageData

And also:

  <ion-img [src]="logo"></ion-img>

To display the image, but none of these works :frowning:

Dont know if this is useful, but this is the code used to fetch the image:

    make_get_img(path, options){
        let headers = Object.assign({
            'Accept': '*/*',
            'Content-Type': '*/*'
            }, options.headers || {})

        if(this.token){
            headers = Object.assign(headers, {
                'token': this.token
            })
        }
        
        let url = this.getUrlWithParams(path, options.urlParams)


        return this.http.get(url, { responseType: 'blob' }, headers);
    }

This is the console.log of the binary:

And the console.log of the base64 string:

image

I tested the string on other sites, and I get a message saying tthe conversion was wrong.
I dont know how to fix this.
Please help.

Posts: 1

Participants: 1

Read full topic

How can we completely hide splash screen IONIC 4 Capacitor

Viewing all 71529 articles
Browse latest View live


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