angular - 角度4中的多个组件中的事件捕获

Question

我有一个名为地址的组件，它多次呈现家庭地址和办公室地址，在更改一个我想更新另一个时，我已经编写了 sharedService 并使用了 eventemmiter。但它捕获相同的组件而不是另一个..我期待“地址”日志两次

@Injectable()
export class SharedService {
  onMainEvent: EventEmitter = new EventEmitter();
}


@Component({ ... })
export class AddressComponent {
  onMain: boolean = false;
  constructor(service: SharedService) {
    service.onMainEvent.subscribe(
      (onMain) => {
        this.onMain = onMain;
        console.log('in Address')
      }
   );
 }
updateAddress(onMain):void {
    this.service.onMainEvent.emit(onMain);
  }

}

Answer 1

您需要将服务注入为单例：

对于 angular 6 及以上

@Injectable({providedIn: 'root'})
   export class SharedService {
     onMainEvent: EventEmitter = new EventEmitter();
   }

对于较低：

@NgModule({
  ...
  providers: [UserService],
  ...
})

做这种事情的更优选方法是使用通量架构，例如 ngrx 或 ngxs 用于角度。