在Typescript

时间:2016-11-28 11:53:38

标签: typescript typescript2.0

我有一个方法,它根据请求url返回一个对象或一个相同对象的数组。逻辑很简单;

myservice.service.ts:

private _url_User = "https://api.github.com/users/dummyuser";
constructor(private _http: Http){}

getUsers(followers?: boolean): Observable<User | User[]>{
        this._url_User += followers?"/followers":"";//if followers equals true edit url, this returns array of same user object
        return this._http.get(this._url_User).map(res=>res.json());
    }

mycomponent.component.ts:

import { Component,OnInit } from '@angular/core';
import {Auth} from '../../services/auth.service';
import {CommentService} from '../../services/comment.service';
import {User} from '../../infrastructure/user';

@Component({
    moduleId:module.id,
    selector: 'app-comment',
    templateUrl: '../../templates/comment.component.html'
})

export class CommentComponent implements OnInit{ 
    user:User;
    followers:User[];
    constructor(private auth: Auth, private commentService: CommentService){
    }
    ngOnInit(){
        this.commentService.getUsers().subscribe(d=>{ this.user=d[0]; console.log(this.user.email)});
        this.commentService.getUsers(true).subscribe(d=>{this.followers=d; console.log(this.followers[0].email)});
    }
}

这是我无法处理的错误消息; enter image description here

1 个答案:

答案 0 :(得分:4)

一般来说,我建议做的实际上是将它分成两个方法,而不是使用布尔标志。这样会更简单,更清晰,也可以免费解决您的打字问题。

如果你真的不想这样做,那么你想要在你的方法中添加function overload。通过这些,您可以告诉TypeScript此函数始终返回标记设置为false的单个用户,或者如果标志设置为true则返回许多用户,并且您将获得您正在寻找的行为。

此函数的重载将如下所示:

getUsers(): Observable<User>;
getUsers(followers: false): Observable<User>;
getUsers(followers: true): Observable<User[]>;
getUsers(followers?: boolean): Observable<User | User[]>{
    this._url_User += followers?"/followers":"";
    return this._http.get(this._url_User).map(res=>res.json());
}

我想把a working example放在操场上,如果你想看看这些看起来是什么样的。

请注意,这确实可以保留仍然存在的潜在歧义。即如果你使用布尔值调用getUsers,并且在编译时TypeScript不知道它是真还是假,它仍然会返回Observable<User | User[]>。您必须使用类型断言或类型保护来获取正确的类型 - 如果您不熟悉这些内容,请查看手册中的Type Guards and Differentiating Types部分。