angular2组件传值

上面是我的页面的入口代码,top是顶部logo显示部分,slider是我的左侧菜单,main中是我具体的页面。

我的页面是管理系统类型的,所以当为login路径时,我希望左侧的slider是不显示的(isLogon为false),那么假如我在login页面登录成功了,我如何使登录成功的状态传递给页面入口的isLogon属性值为true,使slider显示?

假设你有一个login service

import { Injector, Injectable } from @angular/core;
import { Router } from @angular/router;
import { Subject } from rxjs; @Injectable
export class LoginService{ public isLogined: boolean; private changes: Subject<any> = new Subject<any>; constructor { } isLoginedisLogined: boolean: void { this.isLogined = isLogined; this.changes.nextthis.isLogined; }
}

然后在你的页面中

import { Component, Input, Output, EventEmitter, OnInit, OnChanges, OnDestroy } from @angular/core;
import { Router } from @angular/router;
import { LoginService } from ./login.service; @Component{ selector: myApp, template: ` <slider *ngIf="this._loginService.isLogined"></slider>
`
}
export class myApp { constructorprivate _loginService: LoginService { } }

将slider的 *ngIf绑定的 loginservice.isLogined 属性。
然后你就可以在登陆成功处,设置 _loginService.isLoginedtrue;
这样每次当你login成功后,状态就会通知到slider啦。

这里主要用到RxJS的Subject.

有什么问题可以继续提问。

谢邀,这种数据典型的Service应用。

应该放到Service供多组件引用。

不想写dmeo,并给你抛了一个文档 https://angular.cn/docs/ts/la…

你先初始一下isLogin。然后登录成功的状态修改isLogin为true。。类似$scope.isLogin = true

发表评论

电子邮件地址不会被公开。 必填项已用*标注