我正在开发一个通过API请求与服务器通信的Angular应用程序.

我有一个组件存储从服务器接收的对象集合.目前,在每个CRUD操作(创建、读取、更新、删除)之后,我再次从服务器获取包括这个修改/添加对象的整个对象集合.

我的问题是

在每次CRUD操作之后,从服务器获取整个elenet集合是否被认为是一种正常的做法,或者最好使用修改/添加的对象本地更新客户端集合.

示例代码如下.

谢谢

class SampleComponent {

    collection: any = [];

    constructor(private sampleService: SampleService) {
    }

    // Approach 1
    addElement(newElement: any) {
        this.sampleService.addElement(newElement).subscribe(e => {
            this.sampleService.findAllElements(collection => this.collection = collection);
        });

    }

    // Approach 2
    addElement(newElement: any) {
        this.sampleService.addElement(newElement).subscribe(e => {
            this.collection.push(e);
        });
    }
}

推荐答案

考虑一个场景,您的应用有多个用户,每个用户都将执行crud操作,

场景:经理通知团队将至少10000个账单金额更新到其中一行.

  1. 用户1和用户2同时打开屏幕
  2. 用户1将账单金额更新为第1行的10000
  3. 用户2将账单金额更新为第2行的10000

当用户2具有只更新一行的逻辑时.我会看起来像user2是第一个刷新数量到10000的人,即使user1先执行它!

当用户2具有刷新整个表的逻辑时.这将反映用户1已经对10000的一行执行了更新,因此用户2可以恢复他们的更新.

长话短说,刷新整个数据集,以避免过时的数据显示给最终用户!

我们也可以使用websockets和其他技术更新实时更新,但以上方法是我觉得最简单的解决方案

Typescript相关问答推荐

推断类型

类型断言添加到类型而不是替换

如果一个变量不是never类型,我如何创建编译器错误?

如何正确地对类型脚本泛型进行限制

根据另一个属性的值来推断属性的类型

学习Angular :无法读取未定义的属性(正在读取推送)

在不更改类型签名的情况下在数组并集上映射文字

如何在编译时为不带常量的参数引发错误

为什么在这个例子中,我把缺少的属性添加到对象中时,TypeScrip没有拾取,如何修复?

在对象中将缺省值设置为空值

如何在Vue中使用Enum作为传递属性的键类型?

为什么我的查询钩子返回的结果与浏览器的网络选项卡中看到的结果不同?

使用泛型识别对象值类型

如何通过转换器类继承使用多态将对象从一种类型转换为另一种类型

顶点堆叠的图表条形图未在正确的x轴上显示

如何使函数参数数组不相交?

基于属性值的条件类型

完全在类型系统中构建的东西意味着什么?

如何填写Partial的一些属性并让类型系统知道它?

如何从联合类型推断函数参数?