Question

在我的应用程序中，我使用提供程序进行身份验证，使用一个用于加载应用程序配置文件。但auth提供程序使用config提供程序中的数据。所以我希望auth提供程序在调用config方法之前等待getSelectedConfig()提供程序构造函数准备就绪。现在我实现了以下机制

// AuthProvider
@Injectable()
export class AuthProvider {

  private url:string;
  private token:string;

  constructor(
    public http: HttpClient,
    public config: ConfigProvider
  ) { 
    this.loadParams();
  }

  private loadParams() {
    this.config.ready().subscribe(
      ready => {
        this.config.getSelectedConfig().subscribe(
          config => { 
            this.url = config.endpoint;
            this.token = config.token;
          }
        );
      }
    )
  } 
}

// ConfigProvider (in seperate file, of course)
@Injectable()
export class ConfigProvider {

  private selectedConfig:Config = null;
  private configStorageKey:string = "selected_config";
  public readyObservable:Observable<boolean>;

  constructor(
      public storage: Storage,
      public http: HttpClient
    ) {
    this.checkStorageForConfig();
  }

  public ready(){
    return this.readyObservable;
  }

  public checkStorageForConfig() {
    this.readyObservable = Observable.create(
      observer => {
        this.storage.get(this.configStorageKey).then(
          config => {
            if(config){
              this.selectedConfig = config;
            }
            observer.next();
          }
        )
      }
    )
  }
}

因此，我创建了一个Observable，可以提供给auth，以了解是否可以使用config提供程序。

这种方法有效，但我不认为这是一个很好的解决方案。然而，我无法想出一个更好的。我一般不知道如何处理这种情况。

在我看来，我想在不引入其他Observable的情况下简单地调用类似this.config.ready().then( ... )的东西。但毕竟这可能是正确的方法。

Answer 1

你可以通过使用await async / await来简化它，如果逻辑开始进一步增加，我建议你有一个单独的服务来处理onReady问题。这只是一个简单的返工：

// AuthProvider
@Injectable()
export class AuthProvider {

private url: string;
private token: string;

constructor(
    public http: HttpClient,
    public config: ConfigProvider
) {
    this.loadParams();
}

private loadParams() {
    this.config.readyObservable.subscribe(
        ready => {
            if (ready) {
                this.config.getSelectedConfig().subscribe(
                    config => {
                        this.url = config.endpoint;
                        this.token = config.token;
                    }
                );
            }
        }
    )
}

// ConfigProvider (in seperate file, of course)

@Injectable()
export class ConfigProvider {

private selectedConfig: Config = null;
private configStorageKey: string = "selected_config";
public readyObservable: ReplaySubject<boolean> = new 
ReplaySubject(1);

constructor(
    public storage: Storage,
    public http: HttpClient
) {
    waitForStuffInConstructor()
}

public ready() {
    return this.readyObservable;
}
public async waitForStuffInConstructor() {
    await this.checkStorageForConfig();
    this.readyObservable.next(true);
}
public checkStorageForConfig() {
    this.storage.get(this.configStorageKey).then(
        config => {
            if (config) {
                this.selectedConfig = config;
            }
            observer.next();
        }
    )
}

在使用之前，请等待提供者构造函数准备就绪

1 个答案: