Binding data to template after making a call to service using http.get in angular2

Question

Service

 let options = new RequestOptions({ headers: this.headers });
    let body = JSON.stringify(this.params);
     return this.http.post(this.url,body, options)
        .map((res: Response) => res.json() as Observable<Proc>)
        .catch((error: any) => Observable.throw(error.json().error))

Component

 this.procservices.GetProcData(this.selectedServer,"test","test2")
        .subscribe(res => {
            this.inventoryList = res as Proc[];
            console.log(this.inventoryList);
        },
        error => this.errorMessage = <any>error);
}

{"project_name":"WeCareUtility","proc_name":"lookupALL","key_":"dob","r_q":"","t_y":"h","v_size":"10","i_x":"I","e_r":"","lso_rt":"B08","value":""},{"project_name":"WeCareUtility","proc_name":"lookupALL","key_":"gndr","r_q":"","t_y":"h","v_size":"2","i_x":"I","e_r":"","lso_rt":"B09","value":""},{"project_name":"WeCareUtility","proc_name":"lookupALL","key_":"S1","r_q":"","t_y":"h","v_size":"1","i_x":"I","e_r":"","lso_rt":"B10","value":""}]' of type 'string'. NgFor only supports binding to Iterables such as Arrays. at NgFor.ngOnChanges (common.umd.js:1671) at Wrapper_NgFor.ngDoCheck (/CommonModule/NgFor/wrapper.ngfactory.js:49) at CompiledTemplate.proxyViewClass.View_ProcComponent0.detectChangesInternal (/AppModule/ProcComponent/component.ngfactory.js:665) at CompiledTemplate.proxyViewClass.AppView.detectChanges (core.umd.js:12208) at CompiledTemplate.proxyViewClass.DebugAppView.detectChanges (core.umd.js:12355) at CompiledTemplate.proxyViewClass.AppView.internalDetectChanges enter code here(core.umd.js:12193) at CompiledTemplate.proxyViewClass.View_ProcComponent_Host0.detectChanenter code heregesInternal (/AppModule/ProcComponent/host.ngfactory.js:38) at CompiledTemplate.proxyViewClass.AppView.detectChanges (core.umd.js:12208) at CompiledTemplate.proxyViewClass.DebugAppView.detectChanges (core.umd.js:12355) at ViewContainer.detectChangesInNestedViews (core.umd.js:12466)

Answer 1

your inventory list is a JSON string, and needs to be converted. JSON.parse() should convert it from a string to an array of objects.