4

我想知道你应该如何构建一个调用后端的应用程序。

在服务中包装 HTTP 调用似乎是一种自然的做事方式，但是如何/在哪里保存数据以保持一致性？例如，我有一个显示某种 Todo 列表的组件，该列表是从后端检索的OnInit。现在，当从这个组件路由并再次路由回来时，它的所有数据都会被重置。当然，您可以再次调用后端，但是将数据保存在某种服务（甚至是 HTTP 服务）中以供进一步使用不是更有利吗？

进一步澄清：

class Service {

    storedData: number[] = []
    allObjects: BehaviorSubject<any> = new BehaviorSubject()

    ...


    getObj(id) {
        if (!this.storedData.includes(id)) {
            this.getDataFromServer(id)
        }
        return this.allObjects.pipe(
            map(objects => objects.find(obj => obj.id === id)),
            filter(obj  => obj && true)
        )
    }

    getDataFromServer(id) {
        return this.http.get(id).pipe(
            tap(obj => {
                this.storedData.push(id)
                this.allObjects.put(id, obj)
            })
        )
    }
}

这是一种可行的方法还是有其他方法来处理这种情况？

此外，使用需要多种服务来填充其所有字段的对象的最佳方法是什么。（Obj: {a: number, b: number},a由AService和检索）b。BService

您会将这些对象存储在哪里（注入AService并将BService其存储BService/注入到向请求组件提供数据的第三个服务中）？

存储它的最佳方式是什么？

4

2 回答 2

1

Victor Savkin 是谷歌的前核心 Angular 团队成员，他构建了依赖注入、变更检测、表单和路由器模块，他写了一篇关于在 Angular 应用程序中管理状态的优秀文章。

他确定了 Web 应用程序的六种常见状态类型：

  • 服务器状态
  • 持久状态
  • URL 和路由器状态
  • 客户端状态
  • 瞬态客户端状态
  • 本地 UI 状态

关键点

  • 服务器状态存储在服务器上并提供，例如，通过 REST 端点
  • 持久状态是存储在客户端上的服务器状态的子集，在内存中
  • 客户端状态（例如用于创建项目列表的过滤器）未存储在服务器上
  • 建议：在 URL 中反映持久状态和客户端状态是一种很好的做法。

这意味着组件将更新 URL 参数以反映持久状态（即缓存在内存中的客户端上的服务器状态）以及客户端状态，例如选定的过滤器。可以为每个要保持其状态的服务添加 URL 参数。

持久状态存储在 Angular 服务中，其中每个功能单元通常有一个服务，例如待办事项列表服务、用户服务和日志服务。这些服务中的每一个都将在幕后处理状态持久性。例如，当请求数据时，服务会首先检查数据是否已经从服务器获取，只有当数据丢失时，才进行 HTTP 调用。

由于服务是长期存在的，因此数据可能会在整个用户会话期间持续存在。

于 2019-11-16T15:14:51.507 回答
0

因此，首先，每当您从任何页面路由回该特定网址时，因为您的 OnInit 中有您的服务，所以您的后端将被调用。

但是具体来说，如果您希望在路由返回时不调用后端，那么您可以在组件中使用 RouteReuseStrategy 的概念，但我认为这将是一个损失，因为每当您从浏览器路由回该页面时，您的后端不会被调用，但您的数据已过时。

于 2019-11-16T14:18:50.997 回答