Требуется экспертное мнение о совместном использовании данных в угловых

Question

Согласно моему пониманию обмена данными между компонентами, мы можем сделать это с помощью @input (), @output () и создать одну общую службу вещания.

Я считаю, что это лучший способчтобы сделать это как @input и @output в зависимости от различных условий, таких как

1. структура папок должна быть в режиме родитель-потомок, как вложенная структура.

2. Мы не можем использовать @output для компонентов, которые обрабатываются, поскольку мы никогда не найдем его селектор.

3. Также мы не можем использовать @input & @output для не родительских / дочерних компонентов.

Поэтому лучше создать общий сервис для связи, чтобы мы могли общаться даже между одним и тем же компонентом уровня (не parent-child) и дочерним-родительским компонентом.

Так что, пожалуйста, мне нужно все ваше мнение, я прямо здесь или каким-то другим способом?

Answer 1

Если между двумя компонентами нет связи (parent-child или child-parent), вы не можете совместно использовать данные с помощью @input или @output между двумя компонентами. В таком случае вы используете общий сервис, вызывающий функцию общего сервиса, в этой функции «$ next» переменная сервиса, а во 2-м компоненте, где вы хотите использовать, просто пишите «$ subscribe» этой общей сервисной переменной.

// calling common service method and pass data to used by component 2 from component 1
this.commonService.method(data);

// common service variable
private variable1 = new Subject<any>();
variable1$ = this.variable1.asObservable();

// common service method
method(data: any) {
    this.variable1.next(data);
}



// passing and calling itself in component 2
 this.commonService.variable1$.subscribe(data => {
        if (data) {
           // use data send from component 1
        }
    });

Answer 2

Акшай, ты прав.Это на самом деле зависит от ситуации.

1. Когда родительские дочерние отношения с использованием @Input и @Output декоратор - хороший выбор.
2. Избегайте использования @Input, если у вас есть глубоко вложенный объект иТакже хочу обнаружить изменения.Angular не обнаруживает изменения с помощью декоратора @Input с глубоко вложенным объектом.В этом случае сервис является лучшим.
3. Когда вы хотите манипулировать данными, вы можете использовать сервис.Чтобы другой компонент получал данные так, как он хочет.
4. Также вы можете использовать концепцию Redux с использованием хранилища NGRX для совместного использования в любом месте приложения.
5. Другой подход - использовать @ViewChildоформитель.

На практике вы узнаете, где использовать какой подход.