Question

您好我正在使用angular 2制作网络应用程序。

我想在一个组件中添加一些特定于用户的内容，这意味着我希望用户A只能看到A1内容，用户B只能看到B1内容，C-C1等等。

我还想为已登录的用户和访客（未登录的用户）分隔内容。

我该如何处理？据我所知，我应该使用AuthGuard保护内容，为特定用户使用ngIf？

Answer 1

你能用NgSwitch吗？ https://angular.io/docs/ts/latest/api/common/index/NgSwitch-directive.html

<强>模板

<div *ngFor="let item of listOfItems">
  <div [ngSwitch]="item.type">
    <div *ngSwitchCase="'A'">
      <h1>output A - {{ item.name }}</h1>
    </div>
    <div *ngSwitchCase="'B'">
      <h1>output B - {{ item.name }}</h1>
    </div>
    <div *ngSwitchCase="'C'">
      <h1>output C - {{ item.name }}</h1>
    </div>
    <div *ngSwitchDefault>output2</div>
  </div>
</div>

<强>组件

export class SomeComponent {
  public listOfItems = [
    {
      name: 'Adam',
      type: 'C',
    },
    {
      name: 'Eve',
      type: 'B',
    },
    {
      name: 'George',
      type: 'A'
    }
  ];
  constuctor() {}
}

Angular2如何让不同的用户从一个组件中看到不同的内容？

1 个答案: