我使用服务
在两个组件之间传递数据UserComponent
onSubmit(username:string){
this.dataService.push(this.user);
this.navigate();
}
navigate(){
this.router.navigate(['question']);
}
问题组件
import { Component, Input, ViewChild, ElementRef, Renderer } from '@angular/core';
import { DataService } from '.././services/data.service';
@Component({
moduleId: module.id,
selector: 'question',
templateUrl: 'question.component.html',
})
export class QuestionComponent {
name : string;
constructor(private dataService: DataService, private renderer: Renderer) {
}
ngOnInit() {
console.log("Here");
this.dataService.pushData.subscribe((data:any) => this.name = data);
}
服务
import { Injectable,EventEmitter } from '@angular/core';
@Injectable()
export class DataService{
pushData = new EventEmitter<string>();
push(value:string){
console.log("In Service");
this.pushData.emit(value);
}
}
}
但是我能够在问题组件中获取数据而在控制台中没有错误
答案 0 :(得分:2)
UserComponent
并将某些数据推送到该服务。QuestionComponent
QuestionComponent
然后订阅服务事件(太晚)长话短说:第2步发生在第4步之前,因此步骤4s推送数据的事件处理程序永远不会触发,它开始听得太晚(在事件被调用之后)。
你可能正在寻找的东西(我事后认识)是在导航过程中将参数传递给你的组件,即。路线中的参数。如果这就是您需要的全部服务,则可以使用路由类型传递它们并在组件中将其读回。
上的文档<强> UserComponent 强>
navigate(){
this.router.navigate(['question', {user: this.user}]);
}
<强> QuestionComponent 强>
import { ActivatedRoute } from '@angular/router';
constructor(private route:ActivatedRoute) {
}
ngOnInit(): void {
const user = this.route.snapshot.params['user'];
}