JHipster *jhiHasAnyAuthority 指令检查 "no authority"

Question

我需要做一个条件，当用户没有权限（未登录）时可以看到，但是我需要先检查那个权限，所以当用户登录时，我不会看到内容。

我正在使用 JHipster 项目中的 'jhiHasAnyAuthority' 指令。

<div *jhiHasAnyAuthority="''">This should appear.... when the VISITOR is NOT logged </div>

这在有权威的情况下有效（如果你想知道的话）：

<div *jhiHasAnyAuthority="['ROLE_ADMIN', 'ROLE_USER']">This should appear.... when ADMIN or USER is logged </div>
<div *jhiHasAnyAuthority="'ROLE_ADMIN'">This should appear.... when ADMIN is logged </div>

所以我尝试了不同的选择，例如：

<div *jhiHasAnyAuthority="''">This should appear.... when Blank is NOT logged </div>

但它们不起作用！

注意：我不需要将文本放在普通的 DIV 中，因此如果用户未登录它就会出现，因为当它登录时它也会出现。

谢谢

Answer 1

您使用的 *jhiHasAnyAuthority 指令是 JHipseter 项目的一部分。

它的源代码可以在 https://github.com/jhipster/jhipster-sample-app-ng2/blob/master/src/main/webapp/app/shared/auth/has-any-authority.directive.ts

找到

如果你查看源代码，你会发现它不支持否定测试，我假设检查 "HasAnyAuthority" 是否有空或 null 的权限字符串不支持与检查用户是否没有权限相同。

所以，看来你不能使用这个指令来测试权限的缺失，该指令似乎也不支持像 *ngIf 那样的 if/else 语法。

我认为做你想做的事情的唯一方法是编写一个基于 *jhiHasAnyAuthority 的自定义指令，或者修改 *jhiHasAnyAuthority 以添加所需的行为。

无论哪种情况，如果你让它工作，向 JHipster 项目提交拉取请求会很好。

Answer 2

在 app\shared\auth 中创建文件 has-not-authority.directive.ts:

import { Directive, Input, TemplateRef, ViewContainerRef } from '@angular/core';
import { AccountService } from 'app/core/auth/account.service';

/**
 * @whatItDoes Conditionally includes an HTML element if current user has not any
 * of the authorities passed as the `expression`.
 *
 * @howToUse
 * ```
 *     <some-element *jhiHasNotAuthority="'ROLE_ADMIN'">...</some-element>
 *
 *     <some-element *jhiHasNotAuthority="['ROLE_ADMIN', 'ROLE_USER']">...</some-element>
 * ```
 */
@Directive({
  selector: '[jhiHasNotAuthority]'
})
export class HasNotAuthorityDirective {
  private authorities: string[];

  constructor(private accountService: AccountService, private templateRef: TemplateRef<any>, private viewContainerRef: ViewContainerRef) {}

  @Input()
  set jhiHasNotAuthority(value: string | string[]) {
    this.authorities = typeof value === 'string' ? [value] : value;
    this.updateView();
    // Get notified each time authentication state changes.
    this.accountService.getAuthenticationState().subscribe(() => this.updateView());
  }

  private updateView(): void {
    const hasAnyAuthority = this.accountService.hasAnyAuthority(this.authorities);
    this.viewContainerRef.clear();
    if (!hasAnyAuthority) {
      this.viewContainerRef.createEmbeddedView(this.templateRef);
    }
  }
}

更新 app\shared 中的 shared.module.ts 文件：


import { NgModule } from '@angular/core';
import { YourAppSharedLibsModule } from './shared-libs.module';
import { FindLanguageFromKeyPipe } from './language/find-language-from-key.pipe';
import { JhiAlertComponent } from './alert/alert.component';
import { JhiAlertErrorComponent } from './alert/alert-error.component';
import { JhiLoginModalComponent } from './login/login.component';
import { HasAnyAuthorityDirective } from './auth/has-any-authority.directive';
import { HasNotAuthorityDirective } from './auth/has-not-authority.directive';

@NgModule({
  imports: [YourAppSharedLibsModule],
  declarations: [FindLanguageFromKeyPipe, JhiAlertComponent, JhiAlertErrorComponent, JhiLoginModalComponent, HasAnyAuthorityDirective, HasNotAuthorityDirective],
  entryComponents: [JhiLoginModalComponent],
  exports: [
    YourAppSharedLibsModule,
    FindLanguageFromKeyPipe,
    JhiAlertComponent,
    JhiAlertErrorComponent,
    JhiLoginModalComponent,
    HasAnyAuthorityDirective,
    HasNotAuthorityDirective
  ]
})
export class YourAppSharedModule {}

这样，我们有效地复制了 HasAnyAuthorityDirective 的内容，但翻转了 createEmbeddedView 方法调用的条件。

Answer 3

你也可以试试这个方法！

<div *jhiHasAnyAuthority="[]">This should appear... for No_Authority! </div>

PS: 没测试过

JHipster *jhiHasAnyAuthority 指令检查 "no authority"

JHipster *jhiHasAnyAuthority directive check for "no authority"

jhipster

angular