Как отправить строку из app.component.ts в службу и сделать так, чтобы служба отправила строку в компонент.

Я использую Amplify Authentication и получаю строку authstatus, чтобы сообщить мне, вошел ли пользователь. Я хочу поделиться этим статусом с другими компонентами. Это моя попытка создания сервиса, но нужна помощь. Я отправляю строку из app.component.ts и пересылаю ее из сервиса в auth.component и другие.

import { Injectable } from '@angular/core';
import { Subject } from 'rxjs/Subject';

@Injectable({
  providedIn: 'root'
})
export class AuthStatusService {

  authStatus: string;

  authStatusChange: Subject<string> = new Subject<string>();

  constructor()  {
      this.authStatusChange.subscribe((value) => {
          this.authStatus = value
      });
  }

}```
0
Jam66125 29 Апр 2020 в 20:59

2 ответа

Лучший ответ

Вам нужно подтолкнуть значение к наблюдаемому. Переменная authStatus незначительна. Попробуйте следующее

AuthStatusService

export class AuthStatusService {
  authStatusChange: Subject<string> = new Subject<string>();

  constructor() { }

  public getAuthStatus(): Observable<string> {
    return this.authStatusChange.asObservable();
  }

  public setAuthStatus(status: string) {
    this.authStatusChange.next(status);
  }
}

App.component.ts

login() {
  this.service.login().subscribe(
    response => {
      // handle login
      this.authStatusService.setAuthStatus(response.status);
    },
    error => {
      // handle error
    }
}

Child.component.ts

ngOnInit() {
  this.authStatusService.getAuthStatus().subscribe(
    status => {
      // got login status
    }
  );
}

Таким образом, каждый дочерний компонент будет получать статус входа в систему каждый раз, когда из компонента приложения вводится новый статус входа.

2
Michael D 29 Апр 2020 в 18:58

Простым решением будет использование сервиса как хранилища для хранения AuthStatus. Пожалуйста, найдите ниже решение:

В вашем сервисе объявите одну личную переменную и напишите для нее методы получения и установки, как показано ниже:

private authStatus :string;

//this method will be called for updating value of authstatus
setAuthStatus(value : string){
this.authStatus = value;
}

//you can fetch this method from any compononent to get the value of authstatus
getAuthStatus(){
return this.authStatus;
}

В твоем случае,

В app.component.ts вызовите метод setAuthStatus и установите значение

this.service.setAuthStatus("your value");

В других компонентах вызовите метод getAuthStatus и извлеките значение

let authStatus = this.service.getAuthStatus();
2
Sanket wani 29 Апр 2020 в 18:07