javascript - Angular 2 calling Web Api with json results not displaying -

my call angular 1.5.x needed have devices added result.data

result.data.devices

thus angular 1.x $http call this:

var vm = this; var dataservice = $http;  dataservice.get("http://localhost:42822/api/device")         .then(function (result) {  vm.devices = result.data.devices;  

my angular 2 code bit different, i'm calling same web api

if call .json file works display

private _producturl = 'api/devices/devices.json'; 

but i'm not understanding of code of not see add "devices"

private _producturl = 'http://localhost:42822/api/device';  constructor(private _http: http) { }  getproducts(): observable<idevice[]> {//observable<iproduct[]> {     return this._http.get(this._producturl)         .map((response: response) => <idevice[]>response.json())         .do(data => console.log("all: " + json.stringify(data)))         .catch(this.handleerror); } 

wouldn't add in "device" or in html template?

updated

getproducts returns observable collection subscribe on changed

.map((response: response) => <idevice[]>response.json())

this returns list of devices after http request done.

says getproducts defined controller method can subscribe observable collection this.

getproducts().subscribe(data => this.vm.devices = data)

or better separate services (eg. dataservice)

// constructor constructor (private dataservice: dataservice) {}  displaydata(): {     this.dataservice.getproducts()         .subscribe(data => this.vm.devices = data); }