Доброе время уток,кря-кря. Пытаюсь сделать систему меток на Ангуляре, но вот не задача есть компонент :
ngOnInit() {
this.labels = this.labelservice.labels;
}
addLabel() {
const label = new Label((this.NameLabel));
this.labelservice.addLabel(label);
this.NameLabel = '';
}
В нём инициализируется добавление элемента в массив класса метки, есть сервис:
export class LabelService {
constructor() {}
labels:Label[] = [];
addLabel( label:Label) {
this.labels.push(label);
}
deleteLabel(name:string){
console.log(this.labels);
for(let i:number = 0; i<this.labels.length;i++){
if(name = this.labels[i].name){
this.labels.slice(i,i+1);
break;
}
}
}
Который добавляет и удаляет данные с массива, но вот не задача, при попытке удаление с компонента, который является частью массива, т.е. сама метка:
onAction() {
this.labelService.deleteLabel(this.label.name);
}
Я не могу найти элемент, ибо сам массив в сервисе пуст.
Так вот как мне решить эту проблему и почему собственно :
this.labels.push(label);
добавляет элемент не в массив сервиса, а добавляет его в массив компонента. всем спасибо за внимание
Если кому интересно, решил вопрос по другому- воспользовался EventEmitter: https://metanit.com/вweb/angular2/2.10.php - подробно прочитать. исправил в
deleteLabel(name:string){
for(let i:number = 0; i<=this.labels.length;i++){
if(name == this.labels[i].name){
this.labels.splice(i,i);
break;
}
}
}
slice на splice может кто-то тоже не заметил буковку, и в родительском элементе повесил слушатель :
<app-label *ngFor="let label of labels" [label]="label" (deleteName)="deleteLabel($event)"></app-label>
а в дочернем добавил в компонент:
@Output() deleteName: EventEmitter<string>;
onAction() {
console.log(this.label);
this.deleteName.emit(this.label.name);
}
а в темплейте :
<h4 (click)="onAction()">{{label.name}}</h4>
Спасибо за внимание
Я решил схитрить и у меня это не получилосьВ итоге запутался еще больше