简体   繁体   English

将子组件传递给父组件(路由器插座中的子渲染)? 在 Angular 中?

[英]Pass child to parent component (child render in router-outlet) ? in Angular?

I have been working on a project and I got a situation where I am currently stuck.我一直在做一个项目,但我遇到了目前陷入困境的情况。 #situation: I have a child component that is registered in app routes. #situation:我有一个在应用程序路由中注册的子组件。 So which is rendering from router-outlet in the main component which is app.component.ts.所以这是从主组件 app.component.ts 中的路由器出口渲染的。 and there the navbar component is rendering as well.导航栏组件也在渲染。 So the problem is that in a child component something happens I want to notify the navbar component.所以问题是在子组件中发生了一些事情,我想通知导航栏组件。 for that, I can't achieve this using Output() parameter because the component is rendering inside a router-outlet dynamically.为此,我无法使用 Output() 参数来实现这一点,因为该组件正在动态呈现在路由器插座内。 So kindly let me know how to do that.所以请让我知道该怎么做。 Help will be very appreciated.帮助将不胜感激。

here is my app.component.html code.这是我的 app.component.html 代码。

<app-nav *ngIf="_authService._isLoggedIn()"></app-nav>
<div class="container-fluid">
  <app-login *ngIf="!_authService._isLoggedIn()"></app-login>
    <div class="col-md-9">
      <router-outlet *ngIf="_authService._isLoggedIn()"></router-outlet>
    </div>
  </div>
</div>

you can use subjects in a service for example:您可以在服务中使用主题,例如:

someThing = new BehaviorSubject<number>(0);
currentsomeThing = this.someThing.asObservable();

change currrentSomething in child with this:用这个改变孩子的 currentSomething:

this.examleService.someThing.next(digit);

and subscribe this in navbar:并在导航栏中订阅:

this.examleService.currentsomeThing.subscribe(res => ...)

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 Angular 2:让子路由组件替换路由器插座中的Parent - Angular 2: Have Child Route Component Replace Parent in router-outlet 从父级调用子级方法(并传递数据),子级将在 angular 中动态加载组件(路由器出口或延迟加载子级) - Invoke Child method(and pass data) from parent, Child will be dynamically loaded component(router-outlet or lazy loaded child) in angular Angular 5从子插座在父路由器出口上触发导航 - Angular 5 trigger navigation on parent router-outlet from child outlet Angular2中的子级属性更改时更新父级属性(使用路由出口加载的子级组件) - Update Parent Property When Child Property Changes in Angular2 ( Child component loaded using router-outlet) 从子组件路由到父路由器出口 - Routing to parent's router-outlet from a child component 将数据从路由器出口中的组件传递到“父”组件[Angular 2] - Pass data from component in router-outlet to a "Parent'' component [Angular 2] 通过路由器出口“子”组件传递父组件变量 - Pass a parentcomponent variable trough the router-outlet “child” component Angular:使用router-outlet将数据或事件从子节点传递到父节点 - Angular: Passing data or events from child to parent with router-outlet Angular 2 RC5子模块以使用父路由器出口 - Angular 2 RC5 Child module to use parent router-outlet Angular 2/4/5 - 将子组件加载到主路由器插座 - Angular 2/4/5 - Load child component to main router-outlet
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM