代码之家  ›  专栏  ›  技术社区  ›  angler

角度窗体不发送数据

  •  0
  • angler  · 技术社区  · 6 年前

    用户列表

    <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'))
    );
    }
    

    1 回复  |  直到 6 年前
        1
  •  0
  •   alokstar    6 年前

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