pass checkbox checked value from Root to Child Component

Question

Hello, how to pass clicked checkbox value from root to child component. I have sidebar menu in app component and i need to pass value of selected checbox to child component. Thanks in advance!!!

Bhairab Dutt · Answer

Hi , There are 2 scenerios : If one is Parent component and other as child component then you can pass the value to child using @input and if component has not the relation ship of parent and child then you can use angular service for sharing the data . I think , According to your question you can use the @input deccorator . Hope its helps to you. Thanks

Jitendra Kumar · Answer

import {Component,EventEmitter} from "@angular/core"; import {User} from "User.Model"; @Component({ selector: 'component-A', outputs :["selectedUser"], templateUrl:'' }) export class AppComponent{ selectedUser : new EventEmitter ; public rowSelected:boolean = true; constructor(public users : User ) {} getRowData(rowIndex: number, rowData: any): void { this.rowSelected = $(rowIndex).hasClass('selected'); console.log(rowData); this.users= rowData.FirstName; this.selectedUser.emit(this.users); } } Component B Html Component B.ts // skipping some code export class BComponent{ PrintUserInfo(user :User): void { console.log("Name :" + user.Name); } }

Amit Kumar Singh · Answer

Hello I have different component 1.AppComponent 2.RoomComponent I have to pass value from AppComponet to RoomComponent. Thanks

Jitendra Kumar · Answer

import { Component } from '@angular/core' ; @ Component ({ selector : 'appchild' , template : ` Hi {greetMessage} ` }) export class AppChildComponent { greetMessage : string = "I am Child" ; } import { Component } from '@angular/core' ; import { AppChildComponent } from './appchild.component' ; @ Component ({ selector : 'my-app' , template : ` Hello {message} ` , }) export class AppComponent { message : string = "I am Parent" ; } Passing Data From Parent Component to Child Component import { Component , Input , OnInit } from '@angular/core' ; @ Component ({ selector : 'appchild' , template : ` Hi {{greetMessage}} ` }) export class AppChildComponent implements OnInit { @ Input () greetMessage : string ; constructor (){ } import { Component } from '@angular/core' ; import { AppChildComponent } from './appchild.component' ; @ Component ({ selector : 'my-app' , template : ` Hello {{message}} ` , }) export class AppComponent { message : string = "I am Parent" ; childmessage : string = "I am passed from Parent to child component" } ngOnInit (){ } }