如何从具有离子存储的 angular 服务而不是 Promise 获取 promise 的结果<any>作为回应</any>

Question

我将Ionic Storage用于本地存储目的。 为了使用存储，我创建了service ，其中我有 getter 和 setter 存储方法。

我想检查应用程序的负载，是否有任何值在存储中可用，如果值在存储中不可用，而不是只想进行实际数据调用并将设置为存储，但下次病房想从存储而不是实际获取数据。

现在的问题是当我的组件被加载时，我正在调用服务的storage.get方法，这需要时间，并且因为该组件的属性没有设置为实际存储的正确值。

此外，用于从服务返回字符串值的方法不允许在没有最终返回语句的情况下编写方法，如下面的代码中所述[现在我从 Promise 添加了两个返回语句，这对我来说似乎不是正确的设计，但没有我收到编译错误] ，并且由于 Promise 从存储获取响应所花费的时间，两个返回语句都在不同的时间间隔执行，这会导致存储的实际响应过度疲劳。

我不确定如何从 promise 管理这种情况，因为默认情况下离子存储返回 Promise。

 getDefaultLanguage(): string {

     this.storage.get('defaultLanguage').then((res) => {
       return this.defaultLanguage = res || 'en';
     });
     return this.defaultLanguage;
   }

请让我知道如何在组件中保持执行，直到我从 Promise 的上述服务调用中得到响应，因此核心组件的逻辑可以正常工作，还想要正确的方法来实现服务层，我希望结果是来自string而不是promise<any> 。

Answer 1

最简单的方法是将其转换为 promise：

 getDefaultLanguage(): Promise <string> { return new Promise( (resolve, reject) => { this.storage.get('defaultLanguage').then((res) => { resolve(res || 'en'); }); }); }

您当前的方法不起作用的原因是因为this.storage.get是异步的。 return this.defaultLanguage将无法及时完成。 将您的get呼叫包装在另一个Promise中是一种方法。

Answer 2

您可以使用async等待 promise 得到解决：

async getDefaultLanguage(): Promise<string> {
    const res = await this.storage.get('defaultLanguage');
    this.defaultLanguage = res || 'en';

    return this.defaultLanguage;
}

请记住，使用此解决方案getDefaultLanguage现在必须异步调用

Answer 3

感谢@Nenroz 和@mwilson 的两个回答。

它帮助我了解 Promise 的实际工作原理，我宁愿寻找直接从 Promise 返回我的字符串值的单一服务方法，并且还想等待进一步的代码执行直到。

由于前端框架会对自身的变化做出反应，因此与其实际要求这个问题等到从 Promise 获得价值，我会找到一种方法来设法保持 UI，直到 Promise 得到如下解决。 （无需等待进一步的代码执行）

在app.component.ts的constructor中添加了方法InitStorage()

 InitStorage() {
     const defLanguage = this.storageService.getDefaultLanguage();
 }

StorageService.ts的返回Promise<string>的方法如下

 getDefaultLanguage(): Promise<string> {
     return this.storage.get('defaultLanguage');
 }

现在等到从上述方法中获取值并停止进一步的代码执行，直到 promise 得到解决，在ngOnInit的page.ts中添加了它的实现

 ngOnInit() {
      this.defaultLanguage = this.storageService.defaultLanguage;
 }

并在page.html文件中添加了它的值，因此一旦变量 html 中的值可用，就可以由框架刷新/设置，以前我无法在 HTML (previously Value was getting sated after Page was getting loaded, and UI was not getting updated)

 <ion-radio-group [value]="defaultLanguage" />

我不确定这个正确的service架构和Promise中的Angular是否正确，但这就是我设法在service中获得Storage值并能够在变量中使用正确的存储值更新 UI 的方法。

期待对架构改进的任何进一步建议，并感谢所有宝贵的建议。