Angular 4 execute function from another component without using Services

Question

i have a login component, In this component i'm using Dialog Box for login dynamically which is also accessible from other component. In this component we have logout function (to logout user). so how i can execute logout function form other component which is present in Login component.

export class loginComponent implements OnInit {

let postdata = {
     email:email,
     password:password
 }

  this.register.customerLogin(postdata).subscribe( (response) => { response; });

}

logout() {

 localStorage.removeItem('cemail');
 localStorage.removeItem('cname');
 localStorage.removeItem('cid');
 localStorage.removeItem('token');

}

Thanks

Drop the "without using Services" from your arbitrary requirements, since a service is precisely what you should use. — JB Nizet
– JB Nizet, Commented Apr 3, 2018 at 6:34
@DavidVotrubec Thanks for ans. Is any other way to do this ? — Lavkush Gupta
– Lavkush Gupta, Commented Apr 3, 2018 at 6:39
Yes, you can use custom events which will bubble up the DOM and then react to those events, but it is more work and it depends on how your components are related to each other in the DOM. So the service is the easiest and recommended way — David Votrubec
– David Votrubec, Commented Apr 3, 2018 at 6:40

erni · Accepted Answer · 2018-04-03 06:47:01Z

1

Services are better but if you want execute child component methods you can use @ViewChild()

export class AppComponent implements AfterViewInit {

 @ViewChild(ChildComponent) child: ChildComponent;

 ngAfterViewInit() {
  console.log(this.child.myMethod());
 }
}

answered Apr 3, 2018 at 6:47

erni

1761 gold badge1 silver badge10 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Vikas Garg · Accepted Answer · 2018-04-03 07:26:55Z

1

Services are better option but you can use @Output and EventEmitter to create a event and emit from child to parent and pass data from parent to child using @Input.

answered Apr 3, 2018 at 7:26

Vikas Garg

2002 silver badges8 bronze badges

Collectives™ on Stack Overflow

Angular 4 execute function from another component without using Services

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related