видаліть елемент із збереженого масиву в кутовій 2

Я хочу видалити елемент із збереженого масиву в куті 2, з Type Script. Я використовую послугу під назвою Служба даних, код DataService:

export class DataService {

    private data: string[] = [];

    addData(msg: string) {
        this.data.push(msg);
    }

    getData() {
        return this.data;
    }

    deleteMsg(msg: string) {
        delete [this.data.indexOf(msg)];
    }
}

І мій клас компонентів:

import {Component} from '@angular/core'
import {LogService} from './log.service'
import {DataService} from './data.service'

@Component({
    selector: 'tests',
    template:
            `
        <div class="container">
            <h2>Testing Component</h2>
            <div class="row">
                <input type="text" placeholder="log meassage" #logo>
                <button class="btn btn-md btn-primary" (click)="logM(logo.value)">log</button>
                <button class="btn btn-md btn-success" (click)="store(logo.value)">store</button>
                <button class="btn btn-md btn-danger" (click)="send()">send</button>
                <button class="btn btn-md " (click)="show()">Show Storage</button>
                <button (click)="logarray()">log array</button>
            </div>
            <div class="col-xs-12">
                <ul class="list-group">
                    <li *ngFor="let item of items" class="list-group-item" #ival>
                        {{item}}
                        <button class="pull-right btn btn-sm btn-warning" (click)="deleteItem(ival.value)">Delete
                        </button>
                    </li>
                </ul>
            </div>
            <h3>{{value}}</h3>
            <br>
        </div>
    `
})

export class TestsComponent {

    items: string[] = [];

    constructor(
        private logService: LogService,
        private dataService: DataService) {

    }

    logM(message: string) {
        this.logService.WriteToLog(message);
    }

    store(message: string) {
        this.dataService.addData(message);
    }

    send(message: string) {
    }

    show() {
        this.items = this.dataService.getData();
    }

    deleteItem(message: string) {
        this.dataService.deleteMsg(message);
    }

    logarray() {
        this.logService.WriteToLog(this.items.toString());
    }
}

Тепер усе працює добре, крім випадків, коли я намагаюся видалити елемент. Журнал показує мені, що елемент все ще знаходиться в масиві, а тому все ще відображається на сторінці. Як я можу видалити предмет, вибравши його кнопкою видалення ??

Ви не можете використовувати deleteдля видалення елемента з масиву. Це використовується лише для видалення властивості з об'єкта.

Ви повинні використовувати сплайс для видалення елемента з масиву:

deleteMsg(msg:string) {
    const index: number = this.data.indexOf(msg);
    if (index !== -1) {
        this.data.splice(index, 1);
    }        
}

Я думаю, що кутовий спосіб 2 - це метод фільтра:

this.data = this.data.filter(item => item !== data_item);

де data_item - елемент, який слід видалити

Не використовуйте deleteдля видалення елемента з масиву, а використовуйте splice()натомість.

this.data.splice(this.data.indexOf(msg), 1);

Дивіться аналогічне запитання: Як я можу видалити певний елемент із масиву в JavaScript?

Зауважте, що TypeScript - це набір ES6 (масиви однакові як у TypeScript, так і в JavaScript), тому сміливо шукайте рішення JavaScript, навіть працюючи з TypeScript.

Цього можна досягти наступним чином:

this.itemArr = this.itemArr.filter( h => h.id !== ID);

<tbody *ngFor="let emp of $emps;let i=index">

<button (click)="deleteEmployee(i)">Delete</button></td>

і

deleteEmployee(i)
{
  this.$emps.splice(i,1);
}

Ви можете використовувати так:

removeDepartment(name: string): void {
    this.departments = this.departments.filter(item => item != name);
  }

Іноді сплайсу недостатньо, особливо якщо ваш масив задіяний у логіці FILTER. Отже, спочатку ви можете перевірити, чи існує ваш елемент, щоб бути абсолютно впевненим у видаленні саме цього елемента:

if (array.find(x => x == element)) {
   array.splice(array.findIndex(x => x == element), 1);
}

Використовуйте splice()для видалення елемента з масиву його оновлення індексу масиву як наслідок.

delete видалить елемент з масиву, але його не оновить індекс масиву, що означає, якщо ви хочете видалити третій елемент з чотирьох елементів масиву, індекс елементів буде після видалення елемента 0,1,4

this.data.splice(this.data.indexOf(msg), 1)

Ви можете видалити дані з масиву

this.data.splice(index, 1);

//declaration 
list: Array<any> = new Array<any>(); 

//remove item from an array 
removeitem() 
{
const index = this.list.findIndex(user => user._id === 2); 
this.list.splice(index, 1); 
}

Ця робота для мене

 this.array.pop(index);

 for example index = 3 

 this.array.pop(3);