Итак, у меня есть родительский компонент, который отправляет объект назначения в компонент add-contact-popover, когда вы нажимаете кнопку add-contact-button.То есть три компонента.Один родитель, двое детей.
Я добавил ngIf в add-contact-popover, где, если присвоение имеет свойство 'isClicked' true, тогда is отправляет данные на вход add-contact-popover.
Это хорошо работает.Когда вы нажимаете кнопку отмены на всплывающем окне, я хочу установить для объекта назначения значение .isClicked = false;а потом убери поповер.При повторном щелчке по тому же назначению или любому другому назначению процесс должен начаться заново с нового ввода, поступающего от родителя.
Проблема заключается в том, что вы нажимаете кнопку отмены на всплывающем окне.Происходит следующее: объект является первым предыдущим назначением, а затем его новым назначением.Так как-то хранит предыдущие объекты в памяти?Это очень странно.И сложно объяснить.Я покажу консоль из браузера, а затем классы.
Итак, на изображении: все эти клики каждый раз выполняются на разных назначениях!
При первом щелчке родительский элемент устанавливает «isclicked» = true и отправляет дочерний элемент.Это консоль вошла и всплывающее окно появляется.Я нажимаю на отмену.
при втором щелчке консоль записывает предыдущее назначение (Которое имеет 'isClicked' = false btw), а затем я получаю новое назначение от родителя.
при третьем щелчке оно записывает консольдва предыдущих назначения (оба имеют isClicked = false), а затем я получаю новое назначение от родителя.
Почему это ??
ParentComponent:
@Component({
selector: 'assignment-list',
template: `
<tr *ngFor="let assignment of assignmentList">
<td class="actions">
<div (click)="sendToChild(assignment)" style="display: inline">
<add-contact-button-component></add-contact-button-component>
</div>
<add-assignment-contact-popover *ngIf="assignment.isClicked" [dataFromAssignmentList]="assignment"></add-assignment-contact-popover>
</td>
</tr>
`
})
export class AssignmentList implements OnInit {
sendToChild(data: AssignmentListItem) {
data.isClicked = true;
console.log('sendingToChild');
}
}
add-contact-popover
@Input() dataFromAssignmentList: AssignmentListItem;
ngOnInit() {
this.resetValues();
//Clickservice for knowing when createbutton is pushed.
this.buttonClickService.showAddContactPopOver.subscribe((addContactCLick: boolean) => {
if (addContactCLick) {
this.addValuesToPopover(this.dataFromAssignmentList);
}
});
}
addValuesToPopover(assignmentObject: AssignmentListItem) {
console.log('assignmentObject', assignmentObject);
}
onCancel() {
this.dataFromAssignmentList.isClicked = false;
}