Question

我有一个基本上包含单个值的服务。我试图在深层嵌套的组件中使用此值。我使用服务的原因是因为可以通过应用程序中其他位置的路由参数来更改该值。将使用该服务的组件超出routeroutlet，因此需要将route参数存储在此服务中。

服务是这样的：

import { Injectable } from '@angular/core';
import { Subject }    from 'rxjs/Subject';

@Injectable()
export class RouteParamService {

    private contentId = new Subject<number>();
    contentId$ = this.contentId.asObservable();

    setCurrentContentId(id: number) {
        this.contentId.next(id);
    }

}

我正在使用路由参数中的值从组件中调用setCurrentContentId，就像这样（此片段已被截断，因为它是一个非常大的组件）：

@Routes([
    { path:'/',    component: ContentDashboardComponent },
    { path:'/:id', component: ContentEditComponent }
])
export class ContentComponent {

    constructor( 
        private router:Router, 
        private routeSerializer:RouterUrlSerializer, 
        private location:Location, 
        private routeParamService:RouteParamService
    ) {
        router.changes.first().subscribe(() => {
            let urlTree = this.routeSerializer.parse(location.path());
            let urlSegment = urlTree.children(urlTree.children(urlTree.root)[0])[0];
            if(urlSegment != undefined){
                this.routeParamService.setCurrentContentId(urlSegment.segment);
            }
        });
    }
}

到目前为止一切顺利。如果我在console.log中传递给setCurrentContentId的值，它似乎是正确的，并在正确的时间调用。

我现在需要做的是在ngOnInit方法中使用服务中的这个值，在应用程序的其他地方使用完全不同的组件。这是该组件内容的截断版本：

export class ContentTreeComponent implements OnInit {

    _currentNodeId: number;

    constructor(
        private _contentService: ContentService,
        private _router: Router,
        private _currSegment: RouteSegment,
        private _queryStringService: RouteParamService
    ) { 
        _queryStringService.contentId$.subscribe(contentId => {
            console.log('contentId = ' + contentId); // This logs the right thing!
            this._currentNodeId = contentId;
        });
    }

    errorMessage: string;

    @Input('startNodeId')
    private _startNodeId: number;

    contentNodes: ContentNode[];

    ngOnInit() { 
        this.getContentNodes();
        console.log('currentNodeId = ' + this._currentNodeId); // This always logs 'undefined'
    }
}

根据上面的代码注释，从构造函数中的服务正确接收该值。但是，当我尝试在ngOnInit生命周期方法中使用此值时，它总是undefined。

我猜这是因为构造函数中的订阅是异步的吗？

如何从ngOnInit中获取服务的价值？

谢谢！

修改

我甚至需要一个observable，还是我过于复杂？基本上我只想从我的应用程序中可用的路由参数中获取值。它只会在页面加载时设置，而不是动态更新。

修改

我已经尝试将代码从构造函数移动到ngOnInit，但它仍会导致未定义的值：

constructor(
    private _contentService: ContentService,
    private _router: Router,
    private _currSegment: RouteSegment,
    private _queryStringService: RouteParamService
) { }

ngOnInit() { 
    let _currentNodeId: number;
    this.getContentNodes();
    this._queryStringService.contentId$.subscribe(contentId => {
        console.log('contentId = ' + contentId); // This outputs correctly
        _currentNodeId = contentId;
    });
    console.log('currentNodeId = ' + _currentNodeId); // This is always undefined
}

从Angular 2中的ngOnInit中获取服务价值

0 个答案: