Вопрос состоит из 3 частей
1) Имеется объект, содержащий поля, например
export class User {
public constructor(userId?: string, selector?: string, claim?: string, recordId?: string) {
this.userId = userId;
this.selector = selector;
this.claim = claim;
this.recordId = recordId;
}
}
в компоненте есть код
private user: User;
затем функция, которая получает данные с бэкенда
...subscribe( (res) => {
this.user = JSON.parse(res as string);
})
также объект имеет двустороннюю связь в html в input'e [(ngModel)]="user.userId" и т.д. остальные поля
суть проблемы в том что данные приходят с сервера, но не отображаются до тех пор, пока не будет инициализирован объект
private user: User = new User();
либо объект приходится делать статическим, чтобы данные не исчезали, а корректно отображались в инпутах;
Еще если не инициализировать объект или не сделать его статическим, то после того как мы его получили и пытаемся обратиться из другой функции (не из той в которой получили), то он будет - undefined. Даже более того в рамках одной функции, объект будет "жить" только в пределах функции внутри subscription.
Как правильно хранить объекты?
Вторая часть вопроса, следует из первой
2) Если есть объект с более сложной структурой(объект который содержит 3 объекта и массив объектов разного типа)
при привязке через ngModel при загрузке компонента вылетает кучка ошибок "cannot read property '%property_name%' of undefined" Затем объект загружается и ошибки прекращают падать. Загрузка объекта происходит в ngOnInit пробовал делать загрузку в конструкторе, результат тот же, решить проблему удалось только созданием заглушек везде где можно)
т.е. приходится писать везде элвис-операторы и инициализировать пустые объекты.
Например
record: FormRecord = new FormRecord(new User(), new ProfileData(), new Products(), []);
в самом классе описывающем FormRecord
user: User = new User();и т.д
По всей видимости ошибки сыпятся из за того что ngModel начинает опрашивать объект до того как он загрузился с сервера, как можно решить эту проблему не создавая заглушек? элвис операторы в привязке использовать нельзя - ошибка компиляции.
3)Как лучше всего отслеживать изменения в объекте FormRecord?
допустим у меня есть кнопка "Сохранить" при нажатии на которую мы должны сохранить данные в БД, в случае если хотя бы 1 из элементов внутри любого из подобъектов был изменен.
ngOnChange не срабатывает, ngDoCheck или ngAfterViewInit наоборот срабатывают какое то безумное количество раз, после движения мышки по экрану на каждый пиксель. Если даже написать свое условие, думаю этот способ может плохо сказаться на производительности.
нужно событие которые будет срабатывать только после того как юзер отредактировал поле ввода
и изменил фокус элемента
сейчас я просто создаю 2 заглушки, одна из которых привязана к элементам страницы и затем в цикле сравниваю каждое значение внутри объектов.
