角形式脏 vs 原始 vs 触摸 vs 未触及 vs 有效 vs 无效 - 任何

简介

在软件开发过程中，我们可能会涉及到一些角形式脏、原始、触摸、未触及、有效和无效的概念。这些概念通常用来描述代码的质量、安全性和可维护性。在本文中，我们将介绍这些概念的含义以及如何将它们应用于我们的代码中。

角形式脏 (Angular Dirty)

角形式脏是指Angular表单中的模型在前端和后端之间进行传输时发生了变化。例如，在用户更改了表单中的值之后，模型会变得"脏"，并且需要重新同步到后端。在Angular中，我们可以使用dirty属性来检查是否存在此类更改。

if (this.formGroup.dirty) {
  // 重新同步模型到后端
}

原始 (Raw)

原始数据指的是尚未经过任何处理的数据。例如，从数据库或外部API获取的未经过处理的JSON数据。在JavaScript中，我们可以使用JSON.parse()将原始数据转换为对象或数组，以便我们可以按照我们的需求进行处理。

const rawJsonData = '{"name": "John", "age": 25}';
const parsedJsonData = JSON.parse(rawJsonData);
console.log(parsedJsonData.name); // John

触摸 (Touch)

在Angular表单中，"触摸"是指用户与表单交互时，我们将输入标记为"已触摸"。在表单上，我们可以使用touched属性来检查某个输入是否已被用户触摸过。

<input type="text" name="username" [ngModel]="username" required #usernameInput="ngModel">
<div *ngIf="usernameInput.touched && usernameInput.errors?.required">
  用户名是必需的。
</div>

未触及 (Untouched)

与"已触摸"相反，Angular表单中的"未触及"表示输入元素尚未被用户触摸过。这通常用于设置输入字段之初的默认错误状态。

<input type="text" name="username" [ngModel]="username" required #usernameInput="ngModel">
<div *ngIf="usernameInput.untouched">
  请输入用户名。
</div>

有效 (Valid)

在Angular表单中，"有效"表示输入值已通过所有检查规则。例如，如果某个输入字段设置了required检查规则，则只有在字段非空时，该字段才会被视为有效。

<input type="email" name="email" [ngModel]="email" required email #emailInput="ngModel">
<div *ngIf="emailInput.touched && !emailInput.errors?.required && !emailInput.errors?.email">
  该邮件地址有效。
</div>

无效 (Invalid)

相反，如果输入值未能满足任何检查规则，则该值将被视为"无效"。在Angular中，我们可以使用invalid属性来检查某个输入是否已被标记为无效。

<input type="email" name="email" [ngModel]="email" required email #emailInput="ngModel">
<div *ngIf="emailInput.touched && emailInput.invalid">
  请输入有效的邮件地址。
</div>

结论

在本文中，我们了解了在软件开发中使用的一些常见概念。角形式脏、原始、触摸、未触及、有效和无效可以帮助我们更好地理解和优化我们的代码，提高代码的质量和可维护性。