angular - @Output از سرویس


من از Angular CLI استفاده میکنم. در واقع، من یک سرویس دارم. این سرویس متغیر answer را باز میگرداند. من میخواهم از این متغیر در app-component (یا کپی از این متغیر) استفاده کنم. بنابراین وقتی answer تغییر کند، باید در app-component دیده شود. حالا من فقط مقدار اولیه متغیر را میبینم و تغییر answer را نمیبینم.

خدمت :

import { Injectable } from '@angular/core';
import { CanActivate }    from '@angular/router';

@Injectable()
export class LogInGuardService implements CanActivate {


public answer: boolean;
public i: number = 0;


    canActivate() {
        let entered = JSON.parse(localStorage.getItem('enteredValue'));

        let enteredEmail = entered.email_field;
        let enteredPw = entered.password_field;
        let guardChange = false;
        for (var i = 1; i < localStorage.length; i++) {

            let stored = JSON.parse(localStorage.getItem(localStorage.key(i)));
            let storedEmail = stored.email_field;
            let storedPw = stored.password_field;


            if ( enteredEmail == storedEmail )  {

                if ( enteredPw == storedPw ) {
                    this.answer = true;


                } else {
                    alert('Неверный пароль');
                    this.answer = false;
                }

            } else {
                this.i++;
            }
        }

        if (this.i == localStorage.length-1) {
            alert('Пользователя с таким e-mail не существует');
        }
    return this.answer;
  }

  constructor() { }

}

کامپوننت-اپ

import { Component } from '@angular/core';
import { LogInGuardService } from './log-in-guard.service';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {

    public guardInMain: boolean;

    constructor(private loginService: LogInGuardService) {

        this.guardInMain = true;

        this.guardInMain = !this.loginService.answer;

    }
    }

پاسخ شماره ۱

اگر میخواهید مقداری متغیر را در سرویس خود ذخیره کنید، میتوانید از Observables برای این کار استفاده کنید.

برای این کار از BehaviorSubject استفاده کنید. Subject هم قابل مشاهده است و هم ناظر. بنابراین میتوانید به آن بگویید پاسخ جدیدی وجود دارد و تمام مشترکین را مطلع میکند.

در خدمت شما:

answer$ = new BehaviorSubject<string>('');
getAnswer(): Observable<string> {
    return this.answer$.asObservable();
}

giveAnswer(answer: string) {
    this.answer$.next(answer);
}

توجه داشته باشید که سازنده مقدار اولیه را میپذیرد.

شما میتوانید پاسخ جدیدی تنظیم کنید:

AnswerService.giveAnswer('this is my answer');

و شما میتوانید در هر جایی به تغییرات ارزش مشترک شوید:

AnswerService.getAnswer().subscribe(answer => console.log(answer));