方法不断触发数据库

Method keeps triggering database

这个 LanguageService class 被注入到我的组件中,因此它可以获得我的组件的翻译。

它检查键是否在 Map 中;
如果它不在那里:它第一次从服务器获取翻译并将其添加到地图(字典)中。
如果它在那里:它获取 Map 的值而不是再次访问服务器。

奇怪的是,我的日志表明它找到了密钥并将 return 映射中的值但是当我检查 Fiddler 时,它注册了对服务器的调用?

@Injectable()
export class LanguageService {

我的变量

  private loadedTranslations: Map<string, Observable<ITranslate[]>> = new Map();

我的consol.log和Fiddler不同意的地方

  public mapTranslation(url: string, key: string): Observable<ITranslate[]> {

    if (this.loadedTranslations.has(key) == false) {
      console.log("I don't have a key named " + key + ". I'll have to connect to the server");
      this.loadedTranslations.set(key, this.getTranslationFromServer(url));
    }
    else {
      console.log("I have " + key + ". I'll return the values for it!!");
    }

    console.log("Returning Translation for " + url + " with key " + key);

    return this.loadedTranslations.get(key);
  }

此方法调用服务器以获得值

  getTranslationFromServer(url: string): Observable<ITranslate[]> {
    console.log("getTranslationFromServer is called");

    return this._http.get(url)
      .map(this._helperService.extractData)
      .catch(this._helperService.handleErrors);
  }
}

示例输出是这样的:

第一击
日志

I don't have a key named database. I'll have to connect to the server
getTranslationFromServer is called
Returning Translation for Database/Translations with key database

提琴手

GET http://localhost:55041/Database/Translations 200 OK (application/json)

二击
日志

I contain 1 keys
I have database. I'll return the values for it!!
Returning Translation for /Database/Translations with key database

菲德勒

GET http://localhost:55041/Database/Translations 200 OK (application/json)

我尝试从 Observable 更改为 Promise,但没有成功。

为什么 Fiddler 声明它查询数据库,但我没有看到 getTranslationFromServer 被调用了两次
我怎样才能防止这种行为?

我已经编辑了我的地图,而不是持有和 Observable 它现在只持有 ITranslate[]。

我假设访问数据库是在内存中进行的。

@Injectable()
export class LanguageService {
  private loadedTranslations: Map<string, ITranslate[]> = new Map();


  public mapTranslation(url: string, key: string): ITranslate[] {
    if (this.loadedTranslations.has(key) == false) {
      this.getTranslationFromServer(url).subscribe(a => this.loadedTranslations.set(key, a), e => this._helperService.handleError(e));
    }
    else {
      console.log("I have " + key + ". I'll return the values for it!!");
    }

    return this.loadedTranslations.get(key);
  }

  getTranslationFromServer(url: string): Observable<ITranslate[]> {
    return this._http.get(url)
      .map(this._helperService.extractData)
      .catch(this._helperService.handleErrors);
  }
}