我正在使用 Angular 2 (TypeScript)
我有两个组件(实际上它们也是两个页面)。他们不是父子关系。
当我点击第一个组件(页面)中的链接时,我想将一个值传递给第二个组件(页面)。
我知道通过路由器的“URL 参数”方式。但我不想在链接中显示此参数。还有其他办法吗?
谢谢!
最佳答案
规范的方法是建立一个injectable
服务,并将该服务注入(inject)到任何需要数据的组件中。由于该服务是单例的,因此组件将访问相同的数据。他们在不同的页面上应该无关紧要。 Plunker here .
Edit: Here's a more involved example that shows two-way communication between components by subscribing to an eventEmitter on a service: Plunker
import {Component, Injectable} from 'angular2/core'
// your shared service
// provide reference in parent component or bootstrap
@Injectable()
export class myService {
sharedData:string = "String from myService"
}
@Component({
selector: 'page1',
providers: [],
template: `
<div>
<b>Component Page1 - shared data:</b> {{SharedData}}
</div>
`,
directives: [],
})
export class Page1 {
constructor(aService: myService) {
this.SharedData = aService.sharedData
}
}
@Component({
selector: 'page2',
providers: [],
template: `
<div>
<b>Component Page2 - shared data:</b> {{SharedData}}
</div>
`,
directives: [],
})
export class Page2 {
constructor(aService: myService) {
this.SharedData = aService.sharedData
}
}
关于typescript - 在 Angular 2 中的两个组件(页面)之间传递值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34959579/