NgFor开始时显示第一个元素 - Angular 2

Question

每次点击＆＃34;添加行＆＃34;我都会生成一系列输入和下拉列表。按钮。使用其他按钮我提交完整数据，您可以在console.log中看到它。作为对象的数组，其中每个对象实际上就是那一行。

目前它看起来像这样：

但我需要它看起来像这样：

我在弹出窗口中使用它，我需要在弹出窗口打开时立即显示第一行，并且在点击＆＃34;添加行＆＃34;之后应该生成每一行。按钮。 最后，当我提交所有内容时，第一行应首先放在数组中，然后放在其余生成的行中。

有没有办法用索引改变这个plunker，还是有其他解决方案？

阵列看起来像这样：

 0: {name: "A", data: "123", num: "number1", char: "letter1"}
  1: {name: "B", data: "234", num: "number2", char: "letter2"}
  2: {name: "C", data: "345", num: "number3", char: "letter3"}

Answer 1

您需要实现ngOnInit并将属性[0]添加为空属性，如下所示：

ngOnInit() {
  this.properties[0] = this.property;
}

此Plunkr上的示例。

Answer 2

嘿，我记得你的傻瓜了！我相信我是那个实际纠正它的人。你应该问你的另一个问题！

要强制选择值作为默认值，请为绑定到选择的模型赋值。例如，在创建新行时，将模型的值设置为选择的第一个选项。

<强> Something like this.

createRow(){
  this.properties.push({ 
    name:"",
    data: "",
    num: this.numberTypes[0],
    char: this.charTypes[0]
  });
}