Click here to Skip to main content
14,237,399 members
Rate this:
Please Sign up or sign in to vote.
I'm completely new for angularjs2 platform. while i'm implementing the get method so I can get the product.From WebApi i'm getting the Json like below:

{"PersonalInfolistModel":
[{
"EmployeeCode":"1116",
"EmployeeName":"B Rama Krishna Reddy",
"EmployeeDesignation":"SCIENTIST 'E'",
"Salary":"50000"
}],
"Address":[{
"Address1":"1116",
"Address2":"B Rama Krishna Reddy",
"Address3":"SCIENTIST 'E'"

}]
}

How can we import this service in Angular and show in HTML page?


What I have tried:

i tried like given below

my service

import { Injectable } from '@angular/core';
import { IEmployeePersonalInformation } from './PersonalInforamtion';
import { Observable } from 'rxjs/observable';
import { Http, Response } from '@angular/http';
import 'rxjs/add/operator/map';

@Injectable()
export class EmployeeService {

    constructor(private _http: Http) { }

    getEmployees(): Observable<IEmployeePersonalInformation> {
        return this._http.get("http://localhost:4185/api/PersonalInformation/1116")
            .map((response: Response) => <IEmployeePersonalInformation>response.json())
    }

  
}


my component

import { Component, Input, OnInit } from '@angular/core';
import { IEmployeePersonalInformation } from './PersonalInforamtion';
import { EmployeeService } from './PersonalInformationService';

@Component({
    selector: 'list-employee',
    templateUrl: 'app/PersonalInformation/PersonalInformation.component.html',
    styleUrls:['app/PersonalInformation/PersonalInformation.css'],
    providers: [EmployeeService]
})
export class EmployeeListComponent implements OnInit {
    employees: IEmployeePersonalInformation;
    // Inject EmployeeService using the constructor
    // The private variable _employeeService which points to
    // EmployeeService singelton instance is then available
    // throughout this class
    constructor(private _employeeService: EmployeeService) { }
    ngOnInit() {
        this._employeeService.getEmployees()
            .subscribe((employeeData) => this.employees = employeeData);
        
    }
      
}


if i have single json single array list then the code is working but if i have multiple json arrays like
PersonalInfolistModel
and
Address

code not working
Posted
Comments
Christian Graus 29-Apr-19 1:29am
   
Your model needs to match your objects. You need to give us the object class and define 'not working' if you want detailed replies.
Christian Graus 29-Apr-19 1:30am
   
Why are you passing in an id on a method to get all employees?

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)




CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100