我应该在 Angular 应用程序中有 API 个模型和 UI 个模型吗

Question

我正在开发一个应用程序，我使用 .Net Core 作为我的 API，SQL 服务器作为数据库，Angular 作为 UI。我正在学习的课程没有提供太多关于他为什么做他所做的事情的解释，所以我决定 post 在谷歌搜索没有帮助后在这里提出几个问题。在 angular 应用程序中，讲师使用 api-模型（接口）使用 http 方法从服务中的 API 获取数据，然后在组件 .ts 文件中他将可观察到的响应设置为 ui-模型以在模板中使用。

在前端使用 api 和 ui 模型而不是只使用一个模型是一种标准做法还是良好做法？ - 我在 API 中使用 DTO 和 DAO，并且了解其中的原因，但不清楚在前端这样做是否有好处。
创建模型时使用接口而不是 class 有优势吗？到目前为止，这是我看到有人在创建模型时使用 Angular 中的界面的第一个示例。

UI 和 API 模型是相同的。他基本上将 API 获取的数据放入 API 模型并将其转储到 UI 模型中以在模板中使用

Answer 1

当你说模型时，我假设你只是指为你的数据定义一个模式（类型、接口或 class）。它们的主要目的是确保您作为开发人员不会犯错误。如果你已经定义了一个数据类型并且你试图访问一个不存在的属性，打字稿编译器会捕捉到这一点。另一个例子是，如果你尝试用 id 参数做一些数学运算，编译器会告诉你那是一个字符串，而不是一个数字。

是的，您应该在两边都定义您的模式，否则您会到处犯这样的愚蠢错误。另外，通过这种方式您可以获得智能感知和代码补全。

关于接口和classes的区别，在typescript中定义数据类型的方式有3种：

类型

这只是一个对象类型，其中定义了每个属性类型。类型不支持继承，也没有构造函数。

type Fruit = {
  name: string;
  color: string;
  weight: number;
  similarFruits: Fruit[];
  decompose: () => RottenFruit;
};

接口

接口本质上与类型相同，但它们可以 extend 彼此，class 接口可以 implement 它们。

interface Fruit {
  name: string;
  color: string;
}

interface Banana extends Fruit {
  eat: () => string;
}

class BigYellowBanana implements Banana {
  name: string;
  color: string;
  eat: () => string;
  constructor() {
    this.name = 'Big Yellow Banana';
    this.color = 'Yellow';
    this.eat = () => 'mmmm banana';
  }
}

类

类完全是另一种蠕虫，因为它们具有面向对象语言的所有功能。最值得注意的是，可以使用 new 关键字调用的构造函数。

class BigBanana extends SmallBanana implements Banana {
  name: string;
  color: string;
  private eatMessage = 'mmmm banana';
  constructor(color: string) {
    this.color = color;
    this.name = `Big ${color} Banana`;
  }

  eat() {
    return this.eatMessage;
  }
}

const greenBanana = new BigBanana('Green');

我为我愚蠢的例子道歉。

我应该在 Angular 应用程序中有 API 个模型和 UI 个模型吗

Should I have API models and UI models in an Angular app

asp.net

.net-core

asp.net-core

asp.net-core-webapi

angular