使用Angular2服务作为指令（针对ngIf）

我正试图根据用户是否登录（我的用户服务中的导出参数），更改Angular2中导航栏组件的行为。我刚刚将isLoggedIn设置为返回true。不幸的是，链接没有显示，如下所示：

angular2.js:23730异常：在UserService上未找到指令注释

我在应用程序的其他地方使用UserService作为常规服务，我是否可以使其也可以用作指令，而不干扰其任何其他功能

nav.component.ts：

import { Component } from 'angular2/core';
import { RouteConfig, ROUTER_DIRECTIVES } from 'angular2/router';

import { UserService } from '../user/services/user.service';

@Component({
  selector: 'nav-bar',
  template: `
  <div class="nav">
    <a [routerLink]="['LoginComponent']" *ngIf="UserService.isLoggedIn">Login</a>
  </div>
  `,
  styleUrls: ['client/dev/todo/styles/todo.css'],
  directives: [ROUTER_DIRECTIVES, UserService],
  providers: [  ]
})

export class NavComponent {}

更新： 此外，如果我将服务移动到提供程序而不是指令，则组件根本不会显示，错误：

异常：TypeError:无法读取[UserService.isLoggedIn]中未定义的属性“isLoggedIn”NavComponent@2：41]

---

因此，我似乎无法引用该属性？

您正在将服务注入

指令

属性中，因此需要

@组件

或

@指令

directives: [ROUTER_DIRECTIVES, UserService], // <<< Not good! Remove it from there!

编辑

---

所以你的问题更像是我可以使用服务作为指令吗？答案是否定的。你必须用

@Component

或

@Directive

注释你的服务，到那时它将不再是一个简单的服务了。

如果我保持所有代码不变，但将UserService移动到提供者，那么我的导航组件就不显示了？@GeorgeEdwards此时我猜不出是怎么回事，你需要提供一个plnkr来重现你的问题，或者为你的问题添加更多信息。由于这是一个服务，您应该将其注入到组件构造函数中，而我在代码中没有看到这一点。

directives: [ROUTER_DIRECTIVES, UserService], // <<< Not good! Remove it from there!

providers : [UserService] /// Good!