NativeScript with Angular

app.component.ts import { Component, OnInit } from "@angular/core"; import { HttpClient } from "@angular/common/http"; import { Observable } from 'rxjs/Rx'; import "rxjs/add/observable/forkJoin"; @Component({ selector: "Home", moduleId: module.id, templateUrl: "./home.component.html", styleUrls: ['./home.component.css'] }) export class HomeComponent implements OnInit { constructor(private httpClient: HttpClient) { } ngOnInit(): void { Observable.forkJoin([ this.httpClient .get<any>("https://api.github.com/users/kumaran-dena"), this.httpClient .get<any>("https://api.github.com/users/kumaran-dena/followers"), this.httpClient .get<any>("https://api.github.com/users/kumaran-dena/subscriptions") ]).subscribe((response) => { console.log("<<<<<<<<<<<<<<<<<<<<<<<<< first value>...

app.component.ts import { Component, OnInit } from "@angular/core"; import { HttpClient } from "@angular/common/http"; import "rxjs/add/operator/mergeMap"; @Component({ selector: "Home", moduleId: module.id, templateUrl: "./home.component.html", styleUrls: ['./home.component.css'] }) export class HomeComponent implements OnInit { myItems: any[]; constructor(private httpClient: HttpClient) { } ngOnInit(): void { this.httpClient .get<any>("https://api.github.com/users/kumaran-dena") .mergeMap((kums) => this.httpClient.get<any[]>(kums.repos_url)) .subscribe((results) => { this.myItems = results; }); } } app.component.html <ActionBar title="Home" class="action-bar"> </ActionBar> <ListView [items]="myItems"> <ng-template let-item="item"> <StackLayout> <Label [text]='item.owner.login...

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; }

app.component.ts let url = "http://maps.googleapis.com/maps/api/geocode/json?latlng=" + loc.latitude + "," + loc.longitude + "&sensor=true"; //API Call this.http.get(url)  .map(results => results.json())  .subscribe(results => {  console.log("address " + results.results[0].formatted_address);  }, error => {  console.log("ERROR: ", error);  });

home.component.html <ActionBar title="Home" class="action-bar"> </ActionBar> <ScrollView class="page"> <StackLayout class="home-panel"> <Button text="Button" (tap)="onButtonTap()"></Button> </StackLayout> </ScrollView> home.component.ts import { Component, OnInit } from "@angular/core"; declare var android; declare var java: any; @Component({ selector: "Home", moduleId: module.id, templateUrl: "./home.component.html", styleUrls: ['./home.component.css'] }) export class HomeComponent implements OnInit { public ab = "JTNDcCUzRSUzQ3NwYW4lMjBzdHlsZSUzRCUyMmNvbG9yJTNBJTIwcmdiKDM0JTJDJTIwMzQlMkMlMjAzNCklM0IlMjBmb250LWZhbWlseSUzQSUyMGFyaWFsJTJDJTIwc2Fucy1zZXJpZiUzQiUyMiUzRVRlc3QlMjBjcmlja2V0JTIwaXMlMjB0aGUlMjBsb25nZXN0JTIwZm9ybSUyMG9mJTIwdGhlJTIwc3BvcnQlMjBvZiUyMGNyaWNrZXQlMjBhbmQlMjBpcyUyMGNvbnNpZGVyZWQlMjBpdHMlM...

Step - 1 : There are many of email services available, but for this example we’re going use the mailgun service by Rackspace in a NativeScript application. Create a account in Mailgun. If created, you have to keep two important things as mentioned below, Have a look at api keys section in dashboard Private api key (Like - **********6c3e6) Domain name under domain section Once you get the private api key then need to encode it into Base64 string. You may encode internally in app otherwise use the base64encode . Before encode api key, You have to add word api, So " api:actual api key " api:key-0375e*******************************e6 Step - 2 : Create the new Nativescript with Angular app. Once created add the http module in @ngModule imports section in app.module.ts inorder to access http calls methods, app.module.ts import { NativeScriptHttpModule } from "nativescript-angular/http";  ... @NgModule({ imports: [ NativeScriptHttpModule ] ...