Question

由于缺少角度2文档（因此它仍然处于测试阶段），我在这里发布这个问题。我试图弄清楚如何实现一个可以在任何视图上设置或取消设置的简单标志。

要说明我的问题，请参阅下面的代码段。＆＃34; showNav＆＃34; flag确保人们在注销时不会看到导航。

一些评论：

下面的代码段只会在“ngOnInit＆＃39;永远不会再进入。添加注销功能会造成漏洞。
在构造函数中实现逻辑不会对我们有好处，因为这个代码必须在每个子组件上进行复制粘贴，除非有一些方便调用＆＃34; super＆＃34 ;在父构造函数？
我可以实现一项服务，因为它似乎可能是＆＃34; angular2＆＃34;组件之间进行通信的方式，但这看起来非常冗长。

欢迎任何评论！

@Component({
  selector: 'app',
  template:  `
    <nav [ngClass]="{active: showNav}"></nav>
    <router-outlet></router-outlet>
  `
})
@RouteConfig([
  {path:'/login', name: 'Login', component: LoginComponent},
  {path:'/dashboard', name: 'Dashboard', component: DashboardComponent}
])
export class AppComponent implements OnInit {
  public showNav:boolean = false;

  constructor(
    private router:Router,
    private dataService:DataService
  ){}

  ngOnInit() {
    if (!this.dataService.getStore().token) {
      this.router.navigate(['Login']);
      this.showNav = false;
    } else {
      this.router.navigate(['Dashboard']);
      this.showNav = true;
    }
  }

Answer 1

我认为你可能会想到的是Angular 1中曾经是angular.value()的想法。

export var ShowNav: boolean = false;

bootstrap(MyApp, [provide(ShowNav, {useValue: ShowNav})]);

然后在任何视图中，这可以像任何服务或其他类型的提供者一样注入和使用。所有使用它的组件都将共享相同的值。

export class MyComponent{
    constructor(showNav: ShowNav){}

    ...
}

实现重复的视图属性

1 个答案: