Angular2 - 服务初始调用为空答案

【问题标题】：Angular2 - Service initial call is nullAngular2 - 服务初始调用为空
【发布时间】：2017-04-12 23:22:34
【问题描述】：

我有一个带有子路由的父组件。我想做的是在他们之间共享一个项目变量。项目价值可以改变，当它改变时，我需要更新所有的路线页面。我一直在关注anuglar2 tutorial 如何实现这一目标。但是，当我第一次安装调用我的 observable 时遇到问题。当我第一次调用它时，该值不会显示，但是，当我更新它时，该值就会显示。我无法弄清楚为什么项目变量最初没有值。有谁知道这是为什么以及如何解决它？

父路由（可以设置和更新项目的地方）

onSubmit(value: any, valid: any) {
    if (valid) {
        // http request to get project 
        this.ad.searchProject(value)
            .subscribe(
            response => {
                // If projet found set value in service 
                this.ad.setProject(response);
                // navigate to child rotue 
                this.router.navigate(['./project'], { relativeTo: this.route });
            },
            error => {
                console.log(error)
            },
            () => {
                console.log("Project Loaded");
            }
            );
    }
}

项目服务.ts

@Injectable()
export class ProjectService {
    public project: Project;
    // Observable string sources
    private projectSource = new Subject<Project>();
    // Observable string streams
    projectListener$ = this.projectSource.asObservable();
    constructor(private http: Http) {
    }
    searchProject(value: string): Observable<any> {
        return this.http.post('/controller/Project/SearchProject', { value: value }, { headers: headers })
            .map(response => response.json());
    }
    // Service message commands
    setProject(project: Project) {
        this.projectSource.next(project);
        console.log("call setProject"); 
    }
}

子路线

export class ChildComponent {
    project: Project = null;
    subscription: Subscription;
    constructor(private ad: ProjectService) {
        console.log("call child route"); 
        this.subscription = this.ad.projectListener$.subscribe(
            value => {
                // Called after second value is entered
                console.log("call subscription");
                console.log(value);
                this.project = value;
            });
    }
}

控制台日志

[HMR] connected
call parent route
Gravity_Project
setProject
Project Loaded
call child route
// done with first project entry 
Waves Project
call subscription
Object {id: 1001, typeID: 45004, studentID: 10000…}
call setProject
Project Loaded
// done with second project entry

【问题讨论】：

标签： angular typescript observable

【解决方案1】：

答案是行为主体 (https://hassantariqblog.wordpress.com/2016/12/03/angular2-difference-between-a-behavior-subject-and-an-observable/)

“行为主题是主题的一种，主题是一种特殊的可观察对象，因此您可以像订阅任何其他可观察对象一样订阅消息。行为主体的独特之处在于：

行为主体需要一个初始值，因为它必须始终在订阅时返回一个值，即使它没有收到 next() 订阅后，它返回主题的最后一个值。常规的 observable 仅在收到 onnext 时触发在任何时候，您都可以使用 getValue() 方法在不可观察的代码中检索主题的最后一个值。

【讨论】：

我很乐意提供帮助