1
Answer

!No Error but not fetching the data from url in angular2

Hi am trying to fetch some data in from json file using api url..No error showing but not fetching the data.please take a look and let me know what mistake I did
 
 
model.ts
export class SaveDetails {
constructor(public ID: string, public param1: string,public param2: string,public param3: string,public param4: string,public param5: string,public param6: string) { }
}
fetch.json class
[
{"ID": 1, "param1": "MarketMuchukunnu" },
{"ID": 2, "param2": "MarketMuchukunnu" },
{"ID": 3, "param3": "MarketThikkodi" },
{"ID": 4, "param4": "MarketKoyilothumpadi" },
{"ID": 5, "param5": "MarketetIlanjithara" },
{"ID": 6, "param6": "MarketetIlanjithara" }
]
 
 
my service
 
import { Injectable } from '@angular/core';
import {Http, Request, RequestMethod, Response,
RequestOptions, Headers } from '@angular/http';
import 'rxjs/add/operator/map';
import {Observable} from 'rxjs/Observable';
import {SaveDetails} from './SaveDetails';


@Injectable()
export class Uraxservice
{
private _url: string="app/MarketTwoDetails.json"
private url2: string="app/fetch.json"

constructor(private _httpurl:Http){

}

GetUraxDetails(){
return [
{"id": 1, "name": 'MarketIndia' },
{"id": 2, "name": 'MarketAustralia' },
{"id": 3, "name": 'MarketBrazil' },
{"id": 4, "name": 'MarketRussia' },
{"id": 5, "name": 'MarketUSA' }
]
}

GetDropdownTwo(){
return this._httpurl.get(this._url)

.map((response :Response) => response.json());
//.map((res:Response) => res.json());

}
//Get
getContacts(): Observable<SaveDetails[]> {
//debugger
return this._httpurl.get(this.url2)
.map(res => <SaveDetails[]>res.json())

}

//Get
//getContacts(): Observable<SaveDetails[]> {
//debugger
// return this._httpurl.get(this.url2)
// .map(res => <SaveDetails[]>res.json())

}


 
 component.ts
 
import { Component, OnInit } from '@angular/core';
import { list1 } from './app.marketone';
import {Uraxservice} from './urax.service';
import {SaveDetails} from './SaveDetails';

@Component({
selector: 'my-app',
templateUrl:'../app/fetch.html',
styleUrls: ['app/app.component.css'],
providers: [Uraxservice]
})

export class AppComponent implements OnInit {

selectedlist1:list1;
listA=[]
listB=[]

public contacts: SaveDetails[];

constructor( private _uraxservice:Uraxservice){}

ngOnInit()
{
this.listA=this._uraxservice.GetUraxDetails();

this._uraxservice.GetDropdownTwo()
.subscribe(res_ofDTwo =>this.listB=res_ofDTwo);

// this.getContacts();
//Get All
}
getContacts() {
//debugger
this._uraxservice.getContacts().subscribe(
contacts => this.contacts=contacts
);
}


}





 
 html
 



<div>
<h3>fetching..!</h3>
<p>&nbsp;</p>
<table class="table table-striped" style="width: 100%;">
<tbody>
<tr><th>param1</th>
<th>param2</th>
<th>param3</th>
<th>param4</th>
<th>param5</th>
<th>param6</th></tr>
<tr *ngFor="let SaveDetails of contacts">
<tr><th>{{SaveDetails?.ID}}</th>
<th>{{SaveDetails?.param1}}</th>
<th>{{SaveDetails?.param2}}</th>
<th>{{SaveDetails?.param3}}</th>
<th>{{SaveDetails?.param4}}</th>
<th>{{SaveDetails?.param5}}</th>
<th>{{SaveDetails?.param6}}</th></tr>
</tbody>
</table>

</div>
 
 
 

Answers (1)