2016-11-07 34 views
37

में संग्रहीत सरणी से आइटम को हटाएं मैं टाइप स्क्रिप्ट के साथ कोणीय 2 में संग्रहीत सरणी से किसी आइटम को निकालना चाहता हूं।कोणीय 2

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

और मेरे घटक वर्ग:: मैं एक सेवा का उपयोग कर रहा डाटा सेवा, DataService कोड कहा जाता

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

अब, सब कुछ छोड़कर अच्छा काम कर रहा है जब मैं कोई आइटम हटाने का प्रयास करें। लॉग मुझे दिखाता है कि आइटम अभी भी सरणी में है, और इसलिए पेज पर अभी भी दिखाया गया है। डिलीट बटन के साथ इसे चुनने के बाद मैं आइटम को कैसे हटा सकता हूं ??

उत्तर

79

आप किसी सरणी से किसी आइटम को निकालने के लिए delete का उपयोग नहीं कर सकते। यह केवल किसी ऑब्जेक्ट से किसी संपत्ति को निकालने के लिए उपयोग किया जाता है। या अधिक सटीक होने के लिए, संपत्ति को undefined पर सेट करें।

आप एक सरणी से एक तत्व को दूर करने के splice उपयोग करना चाहिए:

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

** नोट: ** यदि आप ' इंडेक्सऑफ() '' -1' के लिए, यह सरणी से अंतिम आइटम को हटा देगा जब 'msg' नहीं मिला था! –

21

delete का प्रयोग न करें सरणी से किसी आइटम को निकालने और इसके बजाय splice() उपयोग करने के लिए।

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

एक समान प्रश्न देखें: How do I remove a particular element from an array in JavaScript?

ध्यान दें, कि टाइपप्रति ES6 का सुपरसेट (सरणियों दोनों टाइपप्रति और जावास्क्रिप्ट में एक ही कर रहे हैं) है, इसलिए जावास्क्रिप्ट समाधान के लिए भी देखने के लिए नि: शुल्क जब टाइपप्रति के साथ काम लग रहा है ।

45

मुझे लगता है कि ऐसा करने का कोणीय 2 रास्ता फिल्टर विधि है:

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

जहां data_item आइटम है कि हटा दिया जाना चाहिए

संपादित मैं कुछ महत्वपूर्ण भूल गया है - आप के लिए है उपरोक्त रेखा से परिणाम के साथ अपनी सरणी को ओवरराइट करें:

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

हालांकि इस टेम्पलेट में – Blauhirn

+1

आप फ़िल्टर करना अपने सरणी – KaFu

+1

removeArrayItem (objectitem) { \t \t this.totalArrayData = this.totalArrayData.filter (आइटम एक पाइप का उपयोग करना चाहिए टेम्पलेट के भीतर किया जाना नहीं कर सकते => item.Id! = = objectitem.id); \t console.log (this.totalArrayData) }। यह काम कर रहा है। Thanx – gnganpath