大佬教程收集整理的这篇文章主要介绍了服务中的Angular 4数据,传递给组件，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
我希望服务订阅从@R_419_2489@返回的数据,并定义了这样的调用：
public setPerson(ac: String): void{ console.log(ac); this.generatePerson(aC).subscribe((data) => { // this.mapPersonFromInput(data[0]); console.dir(data); }); }@H_594_5@mapPersonFrominput()函数是模拟数据的保留.它与下面的extractData基本相同,但是来自代码中的静态对象.
generatePerson看起来像这样：
public generatePerson(id: String):Observable<Person>{ var datRetUrl: String = '/api/' var fullUrl: String = datRetUrl + id; return this.http.get(fullUrl) .map(this.extractData) .catch(this.handleError); }
extractData只是将输入对象的值分配给服务的对象结构,而Handleerror只是将错误记录到控制台.
我通过从导航组件调用此函数来调用服务以在组件加载之前从组件初始化数据对象：
passCodeToservice():void{ this.psn.setPerson(this.accessCodE); this.route.navigate(['/name']); }
在应该获取数据的实际组件中,我正在使用NgOnInit,但我认为@R_101_10675@用ngOnChanges来初始化组件.这是我目前正在使用的代码,但还没有运气修复.
ngOnInit() { this.name =this.psn.getName(); console.log(this.Name); }
getName()只返回我在服务中存储的对象.
public getName(): Name{ return this.servicePerson.name; }
根据你的问题,这是你想要实现的目标：
您可以使用您拥有的代码实现此目的.您需要做的就是添加更多代码并利用RxJs.进一步来说：
>在您的个人服务中创建一个人主题
>当数据从您的@R_419_2489@返回时,请执行personSubject.next(dataFromDB)以添加到人员流.
>创建一个将人物作为可观察对象返回的函数,然后您可以从组件中订阅该observable
使用这种方法,每次数据来自您的@R_419_2489@时,该数据将被添加到人员流中,订阅该流(您的组件)的任何内容都将获取数据.
import { replaySubject } from 'rxjs/replaySubject'; import { Observable } from 'rxjs/Observable'; @Injectable() export class Personservice { // The person subject personStream: replaySubject<Person> = new replaySubject(); // The person observable person$(): Observable<Person> { return this.personStream.asObservable(); } // Get person from DB and add to stream getDataFromDB() { this.http.get(url).subscribe(response => { this.personStream.next(response.person); }); } } @Component({...}) export class MyComponent implements OnInit { person: Person; constructor(private personservice: PersonservicE) {} ngOnInit() { // Subscribe to person observable. Any time person data changes,this will be called. this.personservice.person$().subscribe(person => this.person = person); // If you return the `this.http.get(url)` from `getDataFromDB`,you can just do this instead... this.personservice.getDataFromDB().subscribe(person => this.person = person); } }
但这实在是太过分了,因为实际上你需要做的只是订阅组件中的getDataFromDB函数,因为它本身可以返回一个可观察的Person类型.
以上是大佬教程为你收集整理的服务中的Angular 4数据,传递给组件全部内容，希望文章能够帮你解决服务中的Angular 4数据,传递给组件所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。