How to Connect angular with .net core API and get response in Array
Here is the example of ts file where service is calling and hold in Array list.
import { Component } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { Observable, map } from 'rxjs';
@Component({
selector: 'app-login',
templateUrl: './login.component.html',
styleUrls: ['./login.component.css']
})
export class LoginComponent {
baseURL: string = "https://localhost:44363/";
Model: any;
ArrayList : any;
constructor(private http: HttpClient) {
}
onSave(){
//alert("adasd");
const headers = { 'Access-Control-Allow-Origin': '*', 'Access-Control-Allow-Methods': "POST", 'Access-Control-Allow-Headers': "accept, content-type"}
const body="";
console.log(body)
// this.http.get(this.baseURL + 'api/Values', {responseType: 'text'}).subscribe(payload =>
// this.ArrayList = payload);
//payload => console.log(payload)
this.http
.get('https://jsonplaceholder.typicode.com/users')
.subscribe(payload => {
this.ArrayList = payload
console.log(this.ArrayList);
}
);
// var Result = Req.subscribe();
// // console.log()
}
}
Here is HTML angular page code
<p>Hi Test abc</p>
<button (click)="onSave()">Save</button>
{{ArrayList}}
<div *ngFor="let item of ArrayList; let index=index">
<div class="col">
{{item.id}},{{item.name}},{{item.address.street}}
</div>
<div class="col">
{{item[index+1]}}
</div>
</div>
Comments
Post a Comment