Question

在HeaderComponent上，我正在使用authorize指令：

<li *authorize="'SignedIn'"><button (click)="signIn()">Sign In</button></li>

但是我得到了错误：

Can't bind to 'authorize' since it isn't a known property of 'li'.

HeaderComponent被添加到HeaderModule：

@NgModule({  
  declarations: [    
    HeaderComponent
  ],  
  imports: [
    CommonModule,
    PopupModule
  ],  
  exports: [
    HeaderComponent
  ]
})

将HeaderModule和AuthorizeDirective添加到SharedModule中：

@NgModule({
  declarations: [ 
    AuthorizeDirective
  ],    
  imports: [ 
    CommonModule
  ],
  exports: [ 
    HeaderModule,
    AuthorizeDirective
  ]
})

并将SharedModule添加到AppModule。

我想念什么？

authorize指令是：

@Directive({
  selector: '[authorize]'
})

export class AuthorizeDirective implements OnInit {

  private notifier: Subscription;

  requirement: Requirement;
  id: number;

  @Input() set authorize(requirement: string) {
    this.requirement = Requirement[requirement];
  }

  @Input() set authorizeId(id: number) {
    this.id = id;
  }

  ngOnInit() { 

  }

}

Answer 1

由于HeaderModule是SharedModule的子代，因此您需要重新考虑一些设计。您无法将指令从SharedModule（父级）导入HeaderModule（子级）。您可以将HeaderModule做成独立于SharedModule的模块，也可以创建其他保存AuthorizeDirective的通用模块。

Answer 2

我认为授权是Input，因此您可以像这样使用授权

<li [authorize]="'SignedIn'"><button (click)="signIn()">Sign In</button></li>

无法绑定到“授权”，因为它不是“ li”的已知属性

2 个答案: