Question

嗨，当表单原始时，有什么方法可以在指令内部调用函数。那就是当表单原始时我需要在选项卡头中添加一个CSS类

<form [formGroup]="awayForm" (ngSubmit)="onSubmit()" awayConfirm [cancelClicked]="cancelClick">
</form>

这是我的表单，我在表单内有一个awayConfirm指令。该指令仅指示该表格在选项卡内脏（只需添加CSS类指示）。现在，当表单变得原始时，我需要删除该类

    export class AwayConfirmCheckComponent implements OnInit {  
      ......
     onSubmit(){
        this.awayForm.markAsPristine()
     }
    }

调用markAsPristine时，我需要在awayConfirm指令内触发一个函数。

Answer 1

由于两个组件之间没有关系，因此可以使用共享服务在它们之间传递数据。

我会在共享服务中创建一个BehaviorSubject<boolean>。然后，当我将此next设置为true时，将在其上调用form方法并将其传递给pristine。我也将在其他组件中subscribe BehaviorSubject。调用next方法后，我将能够在其他组件中收到有关此方法的通知。

在共享服务中：

formPristinenessChanged: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(null);

在具有表单的组件中

export class AwayConfirmCheckComponent implements OnInit {
  constructor(private service: SharedService) {}
  ......
  onSubmit() {
    this.awayForm.markAsPristine();
    this.service.formPristinenessChanged.next(true);
  }
}

在其他组件中：

constructor(private service: SharedService) {}

this.service.formPristinenessChanged.subscribe(pristine => {
    if(pristine) // formWasSetToPristine
});

如何在与angular6格式关联的指令内触发函数

1 个答案: