角形式不发送数据

Question

我在 Angular 中的表单不发送数据时遇到问题，我确定这是绑定问题，但我不知道如何解决。

我正在从数据库中检索一组数据并填充用户列表并连接到呈现表单以允许更新用户的另一个控件：

用户列表

<div class="wrapper cf">

<div class="user-list">

<ul class="user-display-data users">
<li *ngFor="let user of users" class="cf"
[class.selected]="user === selectedUser"
(click)="onSelect(user); showDetails=1;">
<div class="user-badge-link" ><span class="display-data user-badge">{{user.first_name}} {{user.last_name}}</span>
<span class="user-display-data user-display-edit">Edit</span></div>
</li>
</ul>

</div>

<div class="user-details" *ngIf="showDetails === 1" >
<app-user-detail [user]="selectedUser"></app-user-detail>
</div>

</div>

更新表格

   <div class="details-wrapper">
    <div>
    <h2 class="sub-head-h2">{{user.first_name}} {{user.last_name}} Account Details</h2>
    <div class="user-detail-data">
    <div class="input-row">
    <label>First Name:</label>
    <input ng-model="first_name" value="{{user.first_name}}" />
    </div>
    <div class="input-row-odd">
    <label>Last Name:</label>
    <input ng-model="last_name" value="{{user.last_name}}" />
    </div>
    <div class="input-row">
    <label>Email:</label>
    <input ng-model="email" value="{{user.email}}" />
    </div>
    <input type="hidden" name="id" id="id" ng-model="id" value="{{user.id}}" />
    <button class="small-button" (click)="save()">Update User</button>
    <button class="small-button" (click)="delete()">Delete User</button>
    </div>
    </div>
    </div>

我在我的服务中设置了一个功能，可以在点击时更新用户：

更新用户

updateUser (user: User): Observable<any> {

var userUpdatedUrl = 'http://dbs:8888/user-update/' + user.id + '/' + user.first_name + '/' + user.last_name + '/' + user.email + '/' + user.password;

console.log(userUpdatedUrl);

return this.http.get(userUpdatedUrl).pipe(tap(_ => this.log(`updated user id=${user.id}`)), catchError(this.handleError<any>('updateUser'))
);
}

单击按钮时会触发 updateUser 函数（控制台记录 URL），但最初填充更新表单的值是发送到端点的值，而不是更新表单本身中的更新字段值，所以我确保我的字段没有正确绑定到模型（或者根本没有绑定）。有什么想法可能出了什么问题？

Answer 1

如果您使用的是 Angular 2 或更高版本，我相信您可能需要查看基本的表单验证和数据绑定，因为在您的代码中我可以看到数据绑定不正确。 您可能会发现以下内容很有用： https://angular.io/guide/form-validation