小编Nho*_*tom的帖子

我是Angular的新手(和Javascript一样).我写了一个Angular服务,它返回一个用户数组.从HTTP调用中检索数据,该调用以JSON格式返回数据.记录从HTTP调用返回的JSON数据时,我可以看到此调用成功并返回正确的数据.我有一个调用服务来获取用户的组件和一个显示用户的HTML页面.我无法从服务获取数据到组件.我怀疑我正在使用Observable.也许我正在使用订阅错误.如果我在ngInit函数中注释掉getUsers调用并取消注释getUsersMock调用,那么一切正常,我看到HTML页面中列表框中显示的数据.我想将JSON数据转换为服务中的数组或用户列表,而不是从服务返回JSON并让组件转换它.

从HTTP调用返回的数据获取用户:

[
    {
        "firstName": "Jane",
        "lastName": "Doe"
    },
    {
        "firstName": "John",
        "lastName": "Doe"
    }
]

user.ts

export class User {
    firstName: string;
    lastName: string;
}

用户service.ts

...
@Injectable
export class UserService {
    private USERS: User[] = [
        {
            firstName: 'Jane',
            lastName: 'Doe'
        },
        {
            firstName: 'John',
            lastName: 'Doe'
        }
    ];

    constructor (private http: Http) {}

    getUsersMock(): User[] {
        return this.USERS;
    }

    getUsers(): Observable<User[]> {
        return Observable.create(observer => {
            this.http.get('http://users.org').map(response => response.json();
        })
    }
...

user.component.ts

...
export class UserComponent …