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

Question

您好，我正在使用 angular 2.

制作 Web 应用程序

我想在一个组件中添加一些用户特定的内容，这意味着我希望用户 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 如何让不同的用户看到同一个组件的不同内容？

Angular2 How to let different users see different contents from one component?

components

angular-ng-if

angular