удалить элемент из сохраненного массива в angular 2

Я хочу удалить элемент из сохраненного массива в angular 2 с помощью Type Script. Я использую службу под названием Data Service, код 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для удаления элемента из массива. Используется только для удаления свойства объекта.

Вы должны использовать splice для удаления элемента из массива:

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

Я думаю, что способ Angular 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);
  }

Иногда сращивания недостаточно, особенно если ваш массив задействован в логике ФИЛЬТРА. Итак, прежде всего вы можете проверить, существует ли ваш элемент, чтобы быть абсолютно уверенным в удалении именно этого элемента:

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