Обновить таблицу после удаления строки в связанном массиве? - PullRequest
Новая
       12

Обновить таблицу после удаления строки в связанном массиве?

1 голос
/ 29 апреля 2019

Я пытаюсь создать таблицу для управления пользователями на моем сайте. Таблица работает отлично, и теперь я пытаюсь добавить кнопки в каждой строке, чтобы дать возможность удалять строки.

Но, когда я нажимаю на кнопку в строке, ничего не происходит. С помощью отладчика я вижу, что строка была удалена из массива, привязанного к таблице, но таблица всегда показывает его.

HTML: 

<tr *ngFor="let user of users |  filter : usersProperties : searchString; let id = index">
          <th class='UId'>{{user.uId}}</th>
          <th class='Username' contenteditable="true" (keyup)="changeValue(id, 'name', $event)" (blur)="updateList(id, 'name', $event)">{{user.userName}}</th>
          <th class='Prenom' contenteditable="true" (keyup)="changeValue(id, 'name', $event)" (blur)="updateList(id, 'name', $event)">{{user.uFirstName}}</th>
          <th class='Nom' contenteditable="true" (keyup)="changeValue(id, 'name', $event)" (blur)="updateList(id, 'name', $event)">{{user.uLastName}}</th>
          <th class='Admin' contenteditable="true" (keyup)="changeValue(id, 'name', $event)" (blur)="updateList(id, 'name', $event)">{{user.uIsAdmin}}</th>
          <th class='suppr'>
            <span class="table-remove">    
              <!-- Her it's the butto for delete the row -->
              <button type="button" class='btn btn-outline-danger my-2 my-sm-0 shadow-sm' (click)="remove(id)">Remove</button>
            </span>
          </th>
        </tr>

Машинопись: 

remove(id: number) {
    this.deleteddrow = []
    if(this.users[id] != null){
      this.deleteddrow.push(this.users[id]);
      this.users.splice(id, 1);
    }
  }

(я сохраняю удаленные строки в массиве для обновления моей базы данных)

РЕДАКТИРОВАТЬ: Пользовательский объект использует модель: 

export class UserModel{
    uId : Number
    userName: string
    uFirstName: string
    uLastName: string
    uPassword: string
    uIsAdmin: boolean
}

1 Ответ

3 голосов
/ 29 апреля 2019

Вам нужно труба transform (), чтобы стрелять. Попробуйте поменять местами следующее, переназначение должно вызвать это. 

this.users.splice(id, 1);

для следующего. Вы, вероятно, не должны передавать индекс как id, но приведенное ниже должно помочь. 

this.users = this.users.filter(data => data !== this.users[id]);

Это то же самое, что и это, но, как уже упоминалось, должно срабатывать transform(). 

let x = [1, 2, 3];

x = x.filter(data => data !== x[1]);
console.log(x);
...