指令中的EventEmitter未在Parent中处理

问题描述

我创建了一个指令，该指令根据用户声明显示或隐藏组件。

是允许的。directive.ts

import { Directive,TemplateRef,ViewContainerRef,Input,Output,EventEmitter } from '@angular/core';
import { SecurityService } from 'app/_security/security.service';

@Directive({
  selector: '[appIsAllowed]'
})
export class IsAllowedDirective {

  @Output() isReady = new EventEmitter<boolean>();

  constructor(
    private templateRef: TemplateRef<any>,private viewContainer: ViewContainerRef,private ss: SecurityService,) { }

  @Input('appIsAllowed') set isAllowed(claimType: any) {
    if (this.ss.hasClaim(claimType)) {
      this.viewContainer.createEmbeddedView(this.templateRef);
      this.notAllowed(false);
    } else {
      this.notAllowed(false);
      this.viewContainer.clear();
    }
  }

  notAllowed(isAllowed: boolean) {
    debugger;
    this.isReady.emit(isAllowed);
  }
}

那么我有2个组成部分。 1是管理模板组件，另一个是示例组件。

admin-template.component.html

<ng-container *ngIf="sampletoUpdate">
  <app-sample *appIsAllowed="'Admin'" (isReady)="notifyIfAllowed($event)"  [sampleData]="sampletoUpdate"></app-sample>
</ng-container>

admin-template.component.ts

notifyIfAllowed($event: boolean) {
    debugger;
    if (!$event) {
      this.toastr.error('You are not allowed to do this operation','Unauthorized',{
        closeButton: true,progressBar: true,timeOut: 3000
      });
    }
  }

sample.component.ts

 @input() sampleData: SampleData;

  constructor() { }

  ngOnInit(): void {
    console.log(this.sampleData);
  }

一切似乎都在指令中按预期方式工作，但是以某种方式，父组件的notifyIfAllowed()未被调用，因为它没有到达断点。我想要实现的是；当由于<app-sample>中处理了claims而无法显示directive时，我需要一个烤面包机来通知用户。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

angular angular2-directives