Typescript Angular2：从其他组件调用方法或变量

我有3个组件<代码>页面菜单，

登录会话

和

登录表单

。在

PageMenu

中，我希望能够访问

LoginSession

中的变量，然后当我拥有它时，我可以维护

LoginForm

的行为，该行为也被导入到

PageMenu

页面菜单：

从'angular2/core'导入{Component}；
从'app/widgets/login session/login session'导入{login session}；
从“app/widgets/login form/login form”导入{login form}；
@组成部分({
选择器：“页面菜单”，
templateUrl:'app/widgets/page menu/page menu.html'，
指令：[路由器指令，登录会话，登录信息]
})
导出类页面菜单{
loginFormVisible：布尔值；
构造函数（专用路由器：路由器）{
this.loginFormVisible=false；
}
onClickNavbar（第页）{
此._router.navigate（[page]）；
}
triggerLoginForm（）{
this.loginFormVisible=LoginSession.loginFormVisibility；
}
}

登录会话：

从'angular2/core'导入{Component}；
@组成部分({
templateUrl:'app/widgets/login session/view/login session.html'，
选择器：“登录会话”
})
导出类登录会话{
状态：字符串；
消息：字符串；
loginFormVisibility：布尔值；
构造函数（）{
this.state='guest'；
this.message='Zaloguj się'；
}
onClick（）{
开关（此状态）{
“客人”一案：
{
this.triggerloginfo（）；
打破
}
}
}
triggerLoginForm（）{
this.loginFormVisibility=！this.loginFormVisibility；
}
}

登录信息：

从'angular2/core'导入{Component}；
从“angular2/common”导入{FORM_指令、FormBuilder、验证器、ControlGroup、Control、NgClass}；
从“angular2/core”导入{Output}；
@组成部分({
templateUrl:'app/widgets/login form/view/login form.html'，
选择器：“登录表单”，
指令：[格式指令]
})
导出类LoginForm{
状态：字符串；
消息：字符串；
loginForm:ControlGroup；
登录：Control=new控件（“，Validators.required）；
密码：Control=new控件（“，Validators.required）；
构造函数（formBuilder:formBuilder）{
this.loginForm=formBuilder.group({
“login”：this.login，
“password”：此为.password，
});
log（'LoginFORM！'）；
}
onSubmit（）{
document.cookie=“sessionId=123456789”；
}
}

使用共享服务在组件之间进行通信和共享

导出类登录服务{
公共登录更改：EventEmitter=neweventemitter（）；
}  

导出类页面菜单{
loginFormVisible：布尔值；
构造函数（专用路由器：路由器，专用登录服务：登录服务）{
this.loginFormVisible=false；
this.\u loginService.loginChanged.subscribe（值=>{this.loginFormVisible=！value；}）
}
...
}

LoginForm

可以以相同的方式访问该值

导出类登录会话{
状态：字符串；
消息：字符串；
loginFormVisibility：布尔值；
构造函数（专用登录服务：登录服务）{
this.state='guest'；
this.message='Zaloguj się'；
}
onClick（）{
开关（此状态）{
“客人”一案：
{
this.triggerloginfo（）；
打破
}
}
}
triggerLoginForm（）{
this.loginFormVisibility=！this.loginFormVisibility；
this.\u loginService.loginChanged.next（this.loginFormVisibility）；
}
}

仅在

bootstrap（）

中注册它，以获得一个应用程序范围的实例：

bootstrap（AppComponent，[LoginService]）

另见

---

非常感谢。太糟糕了，它不能以传播较少的方式完成，但至少它是有效的。同时感谢您参考Angular 2事件。我刚刚开始使用angular2。一个优点是，这种方法测试比组件具有更紧密的依赖关系时容易得多。您好，我正在接收对节点模块的调用失败，错误为：错误：在（LoginService）上找不到指令注释。。知道为什么吗？你的代码中有一些bug。PARHAP添加到

@NgModule（）

中的

指令中，而不是
提供程序中的
。你能在一个扑克牌中复制吗？