Question

我有一个服务，我在2个差异组件中使用：一个来自分页的按钮，另一个来自侧边栏。这两个组件处于同一级别。问题是在按钮组件上方法有效，但如果我在侧边栏上使用它们就不起作用。

服务

public navigate(action: string) {
 if (typeof this.ACTIONS[action] === 'undefined')
 return;

 let shift = this.ACTIONS[action];
 this.setCurrent(shift);

 const curr = this.getCurrent();
 this.activeIndex = curr.index;
 return this.router.navigate([curr.name]);
}

public setDisableFirst() {
 const curr = this.getCurrent();
 if(curr.index == 0) {
  return true;
 }
}

public setDisableLast() {
 const curr = this.getCurrent();
 return ((curr.index + 1) == (this._pages.length)) ? true : false;
}

public setActiveIndex() {
 const curr = this.getCurrent();
 return 'done-' + curr.index;

}

按钮

 public disableFirst() {
  return this.PrevNextService.setDisableFirst();
 }

 public disableLast() {
  return this.PrevNextService.setDisableLast();
 }

 <button type="button" (click)="navigate('PREV')" [disabled]="disableFirst()">
 <button type="button" (click)="navigate('NEXT')" [disabled]="disableLast()">

边栏

 public activeClasss() { 
  return this.PrevNextService.setActiveIndex();
 }


 <div class="list-group-wrapper"  [ngClass]="activeClasss()">

如果我在方法中登录服务这个const curr = this.getCurrent();：navigation，setDisableFirst，setDisableLast，我得到的确切的页码（1,2,3等）是我点击下一个或后面的来自按钮组件。

Service的最后一个方法setActiveIndex使用与上面方法相同的变量。在这里，在服务中，如果控制台日志const curr = this.getCurrent();我只获得了我现在的第一页（1）。如果我一直点击next或prev按钮，这个const保持不变（1）。

我使用Angular 4.有人可以说出我为什么会出现这种行为吗？

Answer 1

您是如何注册服务的？你有一个模块的提供者数组吗？类似下面显示的ProductService？

您是否在多个模块中注册了它？还是在一个组件中？

要使服务作为单身人士正常工作，其提供者只需通过提供者数组在一个地方注册，如下所示。

@NgModule({
  imports: [
    SharedModule
    ])
  ],
  declarations: [
    ProductListComponent
  ],
  providers: [
    ProductService
  ]
})
export class ProductModule {}

从两个不同组件中的Angular 4服务实现方法

1 个答案: