变量捕获行为主体角度服务答案

【问题标题】：variable capture behaviorsubject angular services变量捕获行为主体角度服务
【发布时间】：2021-11-29 19:10:20
【问题描述】：

我对 angular 中的 behaviorSubjects 有疑问

让我们用示例代码描述一个问题

我有这样的服务

export class DataService {
   private _data$ = new BehaviorSubject<any[]>([]);

   public get data() {
      return this._data$.asObservable();
   }

   getDataFromServer() {
     this.http.get(...).subscribe((res) => {
        this._data$.next(res)
    })
   }
}

我也有两个这样的组件

export class componentA {
  
  data : any[] = []

  constructor(private dataService:DataService) {}

  ngOnInit() {
    this.dataService.data.subscribe((res) => {
      this.data = res
    })
  }
}

export class componentB {

  data :any[] = []

  constructor(private dataService:DataService) {}

  ngOnInit() {
    this.dataService.data.subscribe((res) => {
      this.data = res
    })
  }
}

并在两个组件的模板中显示数据数组我的问题是，当我从 componentB 更改 behaviorSubject 的数据时，componentA 中的数据已更改，我希望它们具有不同的 behaviorSubject 实例

【问题讨论】：

标签： angular rxjs

【解决方案1】：

我相信您想要实现的目标与使用BehaviourSubject 无关。

你可以做的是provide你在每个组件上的服务，如下所示：

组件 A：

@Component({
  selector: '...',
  templateUrl: '...',
  styleUrl: ['...'],
  providers: ['MyService'] 
})
export class ComponentA

组件B

@Component({
  selector: '...',
  templateUrl: '...',
  styleUrl: ['...'],
  providers: ['MyService'] 
})
export class ComponentB

每个组件都有一个不同的服务实例，如果组件 B 对服务进行了一些更改，组件 A 将不会知道这些更改，反之亦然，B 不会知道所做的更改一个

理想情况下，您希望在整个应用中提供相同的服务实例，但这种方式也是有效的。

【讨论】：

感谢您的回答，我将尝试此解决方案并提供反馈

【解决方案2】：

模块中声明的服务在模块中的所有组件之间共享。如果您想要服务的私有实例，则需要将其声明为组件本身的提供者。

类似：

@Component({
  selector: 'app-a',
  templateUrl: './a.component.html',
  providers: [ DataService ]
})

【讨论】：

感谢您的回答，我将尝试此解决方案并提供反馈