Как передать значение переменной из компонента в компонент Angular2?

Question

[green176]

Такое дело: Есть компонент меню

@Component({
    selector: 'menu',
    template: '<div [ngClass]="{open : menu_stat}">menu elements...</div>',
})
export class MenuComponent {
   menu_stat : boolean = false;
}

есть компонент логин панель

@Component({
    selector: 'login',
    template: `<button (click)="toggleMenu()">open<button>`,
})
export class LoginComponent {
   menu:boolean = false;
   toggleMenu(){
      this.menu = !this.menu;
   }
}

Необходимо, что бы при нажатии на кнопку в логин панели у меня отображалось меню, т.е. что бы переменная menu_stat в компоненте меню становилась true

Если можно, то на пальцах, ибо доки перерыл, и решения толком нормального не нашел

Answer 1

[Андрей]

С точки зрения архитектуры правильно было бы создать сервис с событием. Этот сервис объявлен в системе и оба компонента получают его в конструкторе с помощью dependency injection. После этого LoginComponent сможет вызвать событие, а MenuComponent - подписаться на него и обрабатывать изменения.

Comments

[green176]

пробовал через сервис, в самом сервисе переменную получаю, а как в меню эту переменную поймать? Точнее даже в меню я отлавливаю переменную, но она не изменяется

[Андрей]

green176: не переменная, а событие. В Angular2 проще всего создать его с помощью Subject. MenuComponent будет вызывать subscribe, а LoginComponent - next. blog.angular-university.io/how-to-build-angular2-a...

[green176]

Андрей: Спасибо, почитаю, попробую