andreys75
@andreys75

Почему не требуется @Output и emit события, если в @Input был передан массив?

Привет всем!
Код работает, но не понимаю почему, по всем докам и курсам он вроде как работать не должен.

Есть родительский компонент - большая форма. В родительском компоненте реализована работа с сервисами: загрузка обновление и удаление данных.
Поскольку форма ну очень большая, разбиваем ее на независимые компоненты. вот есть один потомок:
<app-safety
            [(SafetyIncidents)] = "SafetyIncidents"
            [incidentLevels]="incidentLevels"
            [viewType]="viewType"
            [(IncidentsToDelete)]="safetyIncidentsToDelete"
            (ready)="ready($event,'SafetyBlock')">
 </app-safety>


SafetyIncidents это массив Array<SafetyIncident>.

Внутри компонента потомка (safety) выводим строки для каждого элемента.(решили не делать еще один компонент)
*ngFor="let Incident of SafetyIncidents; let index = index"

и для каждого элемента формы связываем примерно как тут:
<mat-form-field class="col-md-1">
        <input name=SafetyIncidentImpactId [(ngModel)]="Incident.ImpactId" matInput placeholder="Impact ID">
 </mat-form-field>
...
<mat-select [(value)]="Incident.IncidentLevel" [compareWith]="compareObjects">
     <mat-option>--</mat-option>
     <mat-option *ngFor="let level of incidentLevels" [value]="level">{{level.Title}}</mat-option>
</mat-select>


Кнопка сабмит и вызов функции сохранения данных в базу находится в родительском компоненте
я закомментировал строчку
//@Output() SafetyIncedentsChange = new EventEmitter<SafetyIncident[]>();

И вообще еще не успел вызвать в коде дочернего компонента SafetyIncedentsChange.emit(SafetyIncidents);
Но в родительском компоненте все изменения есть и прекрасно сохраняются в базу.

Почему это работает ???
Другой компонент, которому я передаю в качестве @Input простой объект не обновляется без вызова события!
  • Вопрос задан
  • 53 просмотра
Решения вопроса 1
Xuxicheta
@Xuxicheta Куратор тега Angular
инженер
Передаешь ссылку на массив и меняешь его содержимое.

Другой компонент, которому я передаю в качестве @Input простой объект не обновляется без вызова события!

Объект меняется. Просто ангуляр об этом не знает.

Эмит нужен чтобы уведомить родительский компонент о том, что значение переменной изменилось.
Если двусторонне связывание, то родитель в свое свойство записывает то что пришло в эмите.
(скрытое (itemChange) = "item = $event")
Если объект - значение свойства не изменится, в $event придет та же самая ссылка на тот же объект
Если примитив, то $event уже будет отличаться, без эмит уже изменений не будет.
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы