मैं विभिन्न उदाहरणों से गुजर रहा हूं और उनमें से कुछ को आजमाया लेकिन यूआई स्तर से इसे हटाने में असमर्थ हूं। मैंने *ngFor का उपयोग करने का प्रयास किया। तो ngFor केवल <span> को हटा रहा है, <buttons> को <li> टैग में नहीं। फिर मैंने अनुक्रमण के साथ प्रयास किया लेकिन अभी तक कोई सफलता नहीं मिली।

<div>
  <ul style="list-style-type: none;">
    <li  *ngFor="let item of todos; let i = index" class="todo-item">
      <span [ngClass]="{ inactive: item.done }">{{ item.value }}</span>

      <button class="todo-item-button" (click)="editUser()">Edit</button>
      <button class="todo-delete-button" (click)="deleteUser(item,i)">Delete</button>
    </li>
  </ul>
</div>

घटक:-

todos: Todo[] = [];

ngOnInit() {
this.todos = this.todoService.getAllTodos();
}

deleteUser(todos ,index: number) {
    this.todoService.deleteIndexDb(todos.id)
    .subscribe(
      () => {
        this.todos.splice(index, 1);
      });
  }

इसमें थोड़ी मदद चाहिए।

-1
NoobCoder 13 जुलाई 2021, 09:39

3 जवाब

सबसे बढ़िया उत्तर

इसे स्प्रेड सिंटैक्स के साथ पुन: असाइन करें

deleteUser(todos ,index: number) {
    this.todoService.deleteIndexDb(todos.id)
    .subscribe(
      () => {
        this.todos.splice(index, 1);
        this.todos = [...this.todos]
      });
  }
1
Kinglish 13 जुलाई 2021, 07:10

काम करने के लिए कोणीय परिवर्तन का पता लगाने के लिए आपको अपने todos सरणी के संदर्भ को बदलने की आवश्यकता है। Array.splice सबसे अच्छा विकल्प नहीं है, क्योंकि यह एक नई सरणी नहीं बनाता है। आप Array.filter या Array.map का उपयोग कर सकते हैं:

deleteUser(todos ,index: number) {
    this.todoService.deleteIndexDb(todos.id)
    .subscribe(
      () => {
        this.todos = this.todos.map((item, i) => {
          if (i !== index) {
            return item;
          }
        });
      });
  }
1
lbsn 13 जुलाई 2021, 07:06

ऑब्जेक्ट प्रकार के बदलते मान परिवर्तन का पता लगाने को ट्रिगर नहीं करेंगे, Arrays को जावास्क्रिप्ट में ऑब्जेक्ट के रूप में माना जाता है। तो आपको नए सरणी को वापस असाइन करने की आवश्यकता है जो कि नीचे दिखाए गए अनुसार ब्याह विधि से todos ऑब्जेक्ट में लौटा दी गई है।

//ES5`enter code here`
this.todos.splice(index, 1);
this.todos = new Array(this.todos);
//ES6
this.todos.splice(index, 1);
this.todos = [...this.todos];
0
priston lewis 13 जुलाई 2021, 07:25