在Angular 8中,在独立模块之间通过本地服务传递数据的解决方法可以使用以下步骤:
import { Injectable } from '@angular/core';
import { BehaviorSubject } from 'rxjs';
@Injectable({
providedIn: 'root'
})
export class DataService {
private data = new BehaviorSubject('');
setData(data: string) {
this.data.next(data);
}
getData() {
return this.data.asObservable();
}
}
import { Component, OnInit } from '@angular/core';
import { DataService } from '../data.service';
@Component({
selector: 'app-module1',
template: `
`,
})
export class Module1Component implements OnInit {
inputData: string;
constructor(private dataService: DataService) { }
ngOnInit() {
this.dataService.getData().subscribe(data => {
this.inputData = data;
});
}
updateData() {
this.dataService.setData(this.inputData);
}
}
import { Component, OnInit } from '@angular/core';
import { DataService } from '../data.service';
@Component({
selector: 'app-module2',
template: `
Data: {{ data }}
`,
})
export class Module2Component implements OnInit {
data: string;
constructor(private dataService: DataService) { }
ngOnInit() {
this.dataService.getData().subscribe(data => {
this.data = data;
});
}
}
通过使用共享服务,Module1Component可以将数据设置为DataService中的值,而Module2Component可以从DataService中获取数据并使用它。