Угловая форма не отправляет данные - PullRequest
0 голосов
/ 16 октября 2018

У меня проблемы с формой в 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), но значения, которые первоначально заполняют форму обновления, являются значениями, отправляемыми в конечную точку, а не значениями обновленного поля в самой форме обновления, поэтому я уверен, что мои поля не привязаны к модели должным образом (или вообще могут быть),Есть идеи, что может пойти не так?

1 Ответ

0 голосов
/ 16 октября 2018

Если вы используете угловой 2 или выше, я думаю, что вам, возможно, придется взглянуть на базовые проверки форм и привязки данных, так как в вашем коде я вижу, что привязка данных неверна.Вы можете найти следующее полезное: https://angular.io/guide/form-validation

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...