AngularJS6 Как передать данные из родительского компонента в дочерний без обратной связи?

Question

[Pasler]

Проблема в следующем.
Родительский компонент запрашивает данные с сервера и передаёт их в дочернии.
Шаблон:


Определение списка:
export class ParentComponent implements OnInit, OnDestroy {
private fullList: any = [];
getFullList() {
return this.fullList;
}

Определние в дочернем компоненте:
export class ChildComponent implements OnInit, OnChanges {
@Input() myList: any;

Проблема в том, что при изменении полей в одном из дочерних компонентов, данные меняются и других. Можно ли как-то отвязать эту зависимость?

@angular/cli 7.0.6

Comments

[Евгений Лубяной]

Angular 6 без JS. AngularJS относится только к 1.х версиям

Answer 1

[Василий Мажекин]

getFullList() {
return [...this.fullList];
}

Comments

[msdosx86]

самый простой вариант

Answer 2

[Артем Каюн]

А что вы потом делаете с этими измененными данными? Ну то есть зачем вы вообще в дочернем компоненте меняете данные которые используются в родительском?
Это противоречит однонаправленному потоку данных. Если вы хотите в дочернем компоненте менять данные которые вы передаете через @Input() и потом эти измененные данные использовать в родительском компоненте, то вам нужно определить для дочерних компонентов @Output() и тригерить событие на дочернем элементе когда вы поменяли данные. При этом передавать в event копию объекта с данными. В родительском компоненте соответственно слушать событие изменения данных на дочерних компонентах и получать обновленные данные.
Такое решение предпочтительнее в рамках ангуляра, нежели изменять объект по ссылке.