保存用户的所有输入

Question

我有一个 table，其中有一列用于用户输入。显然，table 可以有几行，每一行都有一个用户输入。在 table 下我有一个保存按钮。我的问题是：如果用户输入多个输入，我如何保存所有输入？示例：我的 table 是这样的：

row1 -> input (user writes here: "stack")
row2 -> input (user writes here: "overflow")
saveButton

我想保存“堆栈”和“溢出”。我的代码是：

<div class="mat-elevation-z8 layout-container">
  <table mat-table [dataSource]="dataSourceTable">
    <ng-container matColumnDef="userInput">
      <th mat-header-cell *matHeaderCellDef [attr.rowspan]="2">Input</th>
      <td mat-cell *matCellDef="Input">
        <mat-form-field class="full-width">
          <input matInput/>
        </mat-form-field>
      </td>
    </ng-container>
  </table>
</div>
<button mat-raised-button color="warn" (click)="saveInput()">Save</button>

Answer 1

您可以这样定义您的单元格：

<ng-container matColumnDef="userInput">
  <th mat-header-cell *matHeaderCellDef [attr.rowspan]="2">Input</th>
  <td mat-cell *matCellDef="let Input">
    <mat-form-field class="full-width">
      <input matInput [(ngModel)]="Input"/>
    </mat-form-field>
  </td>
</ng-container>

并在您的 Input 数据上设置 ngModel。

Answer 2

你可以做几件事：

本地存储

本地存储对象存储没有过期日期的数据。这浏览器关闭时数据不会被删除，会被第二天、下周或下一年可用。设置项目：
```
localStorage.setItem(identifier, value)
```
获取物品：
```
localStorage.getItem(identifier)
```
会话存储

会话存储对象只是本地存储，但它会在会话结束时被删除（也就是关闭选项卡）。设置项目：
```
sessionStorage.setItem(identifier, value)
```
获取物品：
```
sessionStorage.setItem(identifier)
```
Cookies Cookie 就像变量，但是当网络服务器向浏览器发送网页后，连接就会关闭，服务器就会忘记用户的一切。
```
document.cookies
```

Answer 3

您可以使用 Formbuilder 然后添加输入字段。然后添加一个方法 onSubmit() 来处理在 <form> 标记中调用的已填写表单，并添加一个提交类型的按钮。

您可以按照指南 here 了解有关操作的详细步骤。

保存用户的所有输入

Save all inputs from the user

html

javascript

typescript

angular-material

angular