JHipster *jhiHasAnyAuthority directive check for “no authority”

问题

I need to make a condition that is seen when the user has no authority (it is not logged in), but I need to check for that authority first, so when the user is logged in, I will not see the content.

I'm using the 'jhiHasAnyAuthority' directive from the JHipster project.

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

This works when there is an authority (in case you wonder):

<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>

So I have tried different alternatives like:

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

But they do not work!

NOTE: I do not need to just put the text in a normal DIV so it will appear if the user is not logged, cause when it is logged it will also appear.

Thanks

回答1:

The *jhiHasAnyAuthority directive that you are using is part of the JHipseter project.

It's source code can be found at https://github.com/jhipster/jhipster-sample-app-ng2/blob/master/src/main/webapp/app/shared/auth/has-any-authority.directive.ts

If you look at the source code, you'll see that it doesn't support a negative test, and I'd assume that checking "HasAnyAuthority" for an authority string that is empty or null is not the same thing as checking that the user has no authority.

So, it appears that you cannot use this directive to test for the absence of an authority, nor does the directive appear to support an if/else syntax like *ngIf does.

I think that the only way to do what you want is to write either write a custom directive based on *jhiHasAnyAuthority, or modify the *jhiHasAnyAuthority to add the desired behavior.

In either case, if you get it working, it would be nice to submit a pull request to the JHipster project.

回答2:

Create file has-not-authority.directive.ts in app\shared\auth:

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);
    }
  }
}

Update the shared.module.ts file in app\shared:


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 {}

This way, we effectively copy the contents of HasAnyAuthorityDirective, but flip the condition for the createEmbeddedView method call.

回答3:

you could have tried this way!

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

PS: I've not tested it.

来源：https://stackoverflow.com/questions/54678369/jhipster-jhihasanyauthority-directive-check-for-no-authority

标签

angular

jhipster