CODEWITHSUNDEEP
angularangular6angular5angular7
HelloWorld
HelloWorld

Reputation: 155

Child component transmit parameter to parent

I want NodeComponent to transmit the parameter to the LayoutComponent.

const routes: Routes = [{
    path: '',
    component: LayoutComponent,
    children: [{
      path: '',
      component: IndexComponent
    }, {
      path: 'node/:nodeId',
      component: NodeComponent
    }]
  }];

Upvotes: 0

Views: 41

Answers (1)

Andrew Radulescu
Andrew Radulescu

Reputation: 1889

I assume your LayoutComponent has the <router-outlet> placeholder that will serve you the proper component based on the router.

You can't send an @Output from the NodeComponent to the LayoutComponent in this case, but you can share the data via a service easily.

Create a service that will keep your Node variables / logic and update the data from the NodeComponent. This way, the LayoutComponent will be able to read it.

Example:

@Injectable()
export class NodeService {

    // Feel free to define observables, other variables or object
    nodeTitle: string;
    nodeBtnEvent: Event;

    setNodeData(nodeTitle, event, ...){
        // Assign the variables or do something
    }     

    getNodeData() {
       return { 
           nodeTitle,
           nodeBtnEvent
       }
    }

    constructor() {}

}

Use the setter to add the data from the NodeComponent and the getter to retrieve the data from the LayoutComponent.

Good luck!

Upvotes: 1

Related Questions