Question

我真的很困惑，没有得到如何继续。需要一些帮助...

要求：

我正在尝试在简单的for中添加动态行并获取控制器中的值，以便我可以发送到java。

到目前为止我做了什么：

我编写了以下代码，当我点击“添加”按钮时添加一个新行，当我点击“删除”按钮时删除一行

问题：

1）起初我写了name =“notification.message”。这里当我在文本框中输入一些值，然后单击“添加”按钮时，它会添加一个新行，但它会删除第一行中输入的数据。

2）为了解决这个问题，我写了一个名字=“{{notification.message}}”。在这里看到名称用括号括起来。现在它不会删除第一行中输入的数据。所以我在想我得到了......但是当我看到控制台时，我的错误就越来越差了。

3）我写了相同的代码，比如在select类型中包装名称（即下拉列表）。但是在这里我添加一个新行时会删除所选的值。并且在控制台中没有错误（如下面的错误，我只得到输入类型文本，

我已经向my earlier question here提供了屏幕截图。

HTML：

<table class="table table-striped table-bordered">
            <thead>
                <tr>
                    <th>#</th>
                    <th>Threshold</th>
                    <th>Notification Level</th>
                    <th>Message</th>
                    <th>Action</th>
                </tr>
            </thead>
            <tbody>
                <!-- <tr> -->
                 <tr *ngFor="let notification of notificationArray; let i = index">
                    <td>{{i+1}}</td>
                    <td>
                        <select class="form-control" maxlength="50" readonly
                                   required
                                   id="threshold"
                                   name="{{notification.thresholdId}}"
                                   [(ngModel)]="notification.thresholdId"  
                                    #threshold="ngModel" >
                                    <option value="0" selected> Select </option>
                                    <option *ngFor="let threshold of thresholdList" value="{{threshold.thresholdId}}" >
                                          {{threshold.threshold}}
                                    </option>
                        </select>
                    </td>
                    <td>
                        <input [(ngModel)]="notification.notificationLevel" id="notificationLevel" #notificationLevel="ngModel" required class="form-control" type="text" name="{{notification.notificationLevel}}" />
                    </td>
                    <td>
                        <input [(ngModel)]="notification.message" id="message" #message="ngModel" required class="form-control" type="text" name="{{notification.message}}" />
                    </td>
                    <td>
                        <button class="btn btn-default"  type="button" (click)="deleteNotification(i)">Delete</button>

                    </td>
                </tr>

            </tbody>
        </table>

TS：

thresholdList: Threshold[];
notificationArray: Array<NotificationLevel> = [];
newNotification: any = {};
addNotification(index) {

    //var newNotification: any = {};
    //newNotification = {};
    this.newNotification = {thresholdId: "0", notificationLevel: "", message: ""}
   // setTimeout(() => this.newNotification = {thresholdId: "0", notificationLevel: "", message: ""}, 2000);
   //  this.notificationArray.push({'thresholdId': "0", 'notificationLevel': "", 'message': ""});

 //   var medData = new NotificationLevel()   // creating object of your model class
    this.notificationArray.push(this.newNotification) ;

    console.log(this.notificationArray);
    return true;
}

deleteNotification(index) {
    console.log(this.notificationArray);
    if(this.notificationArray.length ==1) {
        alert("At least one Notification Required for an Inspection");
        return false;
    } else {
        this.notificationArray.splice(index, 1);
        return true;
    }
}

错误：

ERROR Error: If ngModel is used within a form tag, either the name attribute must be set or the form
      control must be defined as 'standalone' in ngModelOptions.

      Example 1: <input [(ngModel)]="person.firstName" name="first">
      Example 2: <input [(ngModel)]="person.firstName" [ngModelOptions]="{standalone: true}">

Angular 4：在Controller中添加动态行并获取数据

0 个答案: