在Angular和Firebase实时数据库中使用html-input添加大数据

Question

对于我的Web应用程序，我使用Angular，Firebase及其实时数据库，我希望使用户能够使用我的数据表单以某种格式将数据块添加到数据库中。我还是Angular＆Firebase的新手，只能想到解决问题的非常微妙的方法，因此我的问题是：

从html收集所有数据并将其发送到数据库的一种优雅方法是什么？

我要以以下方式组织数据的格式：

Data object
    Type
        name
            propertie
            propertie
            propertie
            propertie
    Type
        name
            propertie
            propertie
            propertie
            propertie

html输入表单：

<input placeholder="Data object name">
<!-- Row 1-->
<div>
    <select>
        <option *ngFor="let type of selectValues" [value]="type">
            {{title}}
        </option>
    </select>
    <input placeholder="name">
    <input placeholder="propertie">
    <input placeholder="propertie">
    <input placeholder="propertie">
    <input placeholder="propertie">
</div>
<!-- Row 2 -->
<div>
    <select>
        <option *ngFor="let type of selectValues" [value]="type">
            {{title}}
        </option>
    </select>
    <input placeholder="name">
    <input placeholder="propertie">
    <input placeholder="propertie">
    <input placeholder="propertie">
    <input placeholder="propertie">
</div>
<button>Save Data object</button>

为简单起见，我仅添加了2x5输入，但最终形式最多可以包含10x5输入。预先感谢！