Skip to main content

How to load image from base64 encoded string format http response in nativescript angular

app.component.html

<Image *ngIf="checksign" [src]="sign" class="img-rounded p-l-15 p-r-15 p-t-15" col="0" stretch="aspectFit"></Image>
<Button class="btn btn-primary btn-rounded-sm" col="0" text="Attach" (tap)="onSetsign()"></Button>

Through Html


<Image [src]="'data:image/png;base64,'+auditor.audSignature"
class="img-rounded p-l-15 p-r-15 p-t-15" col="2" stretch="aspectFit"></Image>

app.component.ts

declare var android;
declare var java: any;

public onSetsign() {

//this.ObsArray[0].audSignature - base64 encoded value
let a= android.util.Base64.decode(this.ObsArray[0].audSignature,android.util.Base64.DEFAULT);
let b= new java.lang.String(a);
let c: string = 'data:image/png;base64,' + b;
console.log("check a " + a);
this.sign = a;
this.checksign = true;
}

Comments

Popular posts from this blog

NgFor Directive with Index in nativescript angular

home.component.ts import { Component, OnInit } from "@angular/core"; @Component({ selector: "Home", moduleId: module.id, templateUrl: "./home.component.html", styleUrls: ['./home.component.css'] }) export class HomeComponent implements OnInit { silabusList = [ { "subject": "tamil" }, { "subject": "hindi" }, {"subject": "english"}, { "subject": "spanish" }, ] constructor() { } ngOnInit(): void { } btn(args) { console.log("index subje " + args) } } home.component.html <ActionBar title="Home" class="action-bar"> </ActionBar> <ScrollView class="page"> <StackLayout class="home-panel"> <StackLayout *ngFor="let item of silabusList ; let i = index"> <Label [text]="item.subject" (tap)="btn(i)" ></Label> </...

Using Icons from graphemica/whatsapp in nativescript angular

Using graphemica Icons -  1. Open the below link http://graphemica.com/%F0%9F%93%8E 2. Copy the icon then paste in the label text as mentioned, <Label text="📎" horizontalAlignment="center"></Label> Using Whatsapp Icons -  1. Just open the whatsapp web,  https://web.whatsapp.com/ 2. Copy the icons/symbols then paste it in the label text  as mentioned, <Label horizontalAlignment=" center " text="😍"></Label>

Dividing screen into multiple fragments for design home screen menus in nativescript angular

home.component.ts import { Component, OnInit } from "@angular/core"; @Component({ selector: "Home", moduleId: module.id, templateUrl: "./home.component.html", styleUrls: ['./home.component.css'] }) export class HomeComponent implements OnInit { onButtonTap(): void { console.log("Button was pressed"); } constructor() { } ngOnInit(): void { } } home.component.html <ActionBar title="Home" class="action-bar"> </ActionBar> <GridLayout height="90%" width="95%" rows="*,*" columns="*,*"> <StackLayout class="a" row="0" col="0"> <Button text="Button 1" (tap)="onButtonTap()"></Button> </StackLayout> <StackLayout class="b" row="0" col="1"> <Button text="Button 2" (tap)="onButtonTap()"...