Eksik kontrol akışı direktifi

Bu tanılama, bir şablonda bilinen kontrol akışı direktiflerini (*ngIf, *ngFor veya *ngSwitch gibi) kullanan bağımsız bir bileşenin, bu direktifleri tek tek veya CommonModule'ü içe aktararak da içe aktardığından emin olur.

import {Component} from '@angular/core';

@Component({
  // Template uses `*ngIf`, but no corresponding directive imported.
  imports: [],
  template: `<div *ngIf="visible">Hi</div>`,
})
class MyComponent {}

Bunda ne yanlış?

Bir kontrol akışı direktifini içe aktarmadan kullanmak çalışma zamanında başarısız olur, çünkü Angular HTML elemanının var olmayan bir ngIf özelliğine bağlanmaya çalışır.

Bunun yerine ne yapmalıyım?

İlgili kontrol akışı direktifinin içe aktarıldığından emin olun.

Bir direktif tek tek içe aktarılabilir:

import {Component} from '@angular/core';
import {NgIf} from '@angular/common';

@Component({
  imports: [NgIf],
  template: `<div *ngIf="visible">Hi</div>`,
})
class MyComponent {}

veya tüm kontrol akışı direktiflerini içeren CommonModule'ün tamamını içe aktarabilirsiniz:

import {Component} from '@angular/core';
import {CommonModule} from '@angular/common';

@Component({
  imports: [CommonModule],
  template: `<div *ngIf="visible">Hi</div>`,
})
class MyComponent {}

Yapılandırma gereksinimleri

Herhangi bir genişletilmiş tanılamanın verilmesi için strictTemplates etkinleştirilmelidir. missingControlFlowDirective, strictTemplates dışında ek bir gereksinime sahip değildir.

Bunu önleyemezsem ne olur?

Bu tanılama, projenin tsconfig.json dosyası düzenlenerek devre dışı bırakılabilir:

{
  "angularCompilerOptions": {
    "extendedDiagnostics": {
      "checks": {
        "missingControlFlowDirective": "suppress"
      }
    }
  }
}

Daha fazla bilgi için genişletilmiş tanılama yapılandırması bölümüne bakın.