Почему наблюдаемый Сервис создает второй Экземпляр, если он вызывается в AppMdoule? - PullRequest
0 голосов
/ 17 марта 2020

Я создал эту службу:

@Injectable({ providedIn: 'root' })
export class HeaderService {
private _loggedIn = new BehaviorSubject<boolean>(false);
public isLoggedIn() {
    return this._loggedIn.asObservable();
  }
 public setLoggedIn(loggedIn: boolean) {
    this._loggedIn.next(loggedIn);
  }
}

У меня есть 2 модуля в моем приложении Angular. Главное и другое. Когда я вызываю setLoggedIn из компонента, который является частью ÀppModule, он не использует тот же экземпляр службы, что и экземпляр из HeaderComponent, где я подписался на Observable через isLoggedIn(), но когда я вызываю метод обновления в компоненте, который не является частью ÀppModule, который называется подпиской. Как я читал на Angular сайте, когда объявлял Сервис с моим Синтаксисом, это должен быть Singleton, так что я сейчас в замешательстве. У кого-нибудь была похожая проблема? И успешно исправил это.

Мой HeaderComponent внутри AppModule:

@Component({
  selector: 'app-header',
  templateUrl: './header.component.html',
  styleUrls: ['./header.component.css']
})
export class HeaderComponent implements OnInit {

  public sites; //Array of Routes displayed in Navigation
  constructor(private headerService: HeaderService, ) {
    ...
  }
  ngOnInit(): void {
    this.headerService.isLoggedIn().subscribe(((isLoggedIn) => {
      if (isLoggedIn)
        this.sites = this.headerService.loginLinks;
      else
        this.sites = this.headerService.logoutLinks;
    }));
  }
}

Мой RegisterComponent в LoginScreenModule:

@Component({
  selector: 'app-register1',
  templateUrl: './register1.component.html',
  styleUrls: [
    './register1.component.css',
    './../../assets/stylesheets/multiple-use/form.css'
  ]
})
export class Register1Component implements OnInit {

  constructor(
    private headerService: HeaderService

  ) {
    ...
  }

  public ngOnInit(): void {
    this.headerService.setLoggedIn(false);
  }
}

Мой SearchComponent in AppModule:

@Component({
  selector: 'app-search',
  templateUrl: './search.component.html',
  styleUrls: ['./search.component.css']
})
export class SearchComponent implements OnInit {

  constructor(private headerService: HeaderService) { }

  ngOnInit(): void {
    this.headerService.setLoggedIn(true);
  }

}

1 Ответ

0 голосов
/ 17 марта 2020

Вам необходимо удалить инъекцию из класса обслуживания, вы также вводите ее через @Injectable decorator.

Пожалуйста, удалите ее из этой строки в своем классе обслуживания. @Injectable({ providedIn: 'root' }).

Это должно выглядеть следующим образом:

@Injectable()
...