`*ngFor` 표현식의 `let` 키워드 누락

이 진단은 *ngFor에 사용한 표현식에 let 키워드가 없을 때 발생합니다.

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

@Component({
  // The `let` keyword is missing in the `*ngFor` expression.
  template: `<div *ngFor="item of items">{{ item }}</div>`,
})
class MyComponent {
  items = [1, 2, 3];
}

무엇이 문제인가요?

let이 누락되었다면 *ngFor 문자열에 문법 오류가 있다는 뜻입니다. 또한 item이 스코프에 올바르게 포함되지 않아 {{ item }}을 제대로 해석할 수 없습니다.

어떻게 해결하나요?

누락된 let 키워드를 추가하세요.

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

@Component({
  // The `let` keyword is now present in the `*ngFor` expression,
  // no diagnostic messages are emitted in this case.
  template: `<div *ngFor="let item of items">{{ item }}</div>`,
})
class MyComponent {
  items = [1, 2, 3];
}

필수 설정

확장 진단이 발생하려면 strictTemplates를 활성화해야 합니다. missingNgForOfLet에는 strictTemplates 외의 추가 요구 사항이 없습니다.

이 상황을 피할 수 없다면 어떻게 하나요?

프로젝트의 tsconfig.json 파일을 수정하여 이 진단을 비활성화할 수 있습니다.

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

자세한 내용은 확장 진단 설정을 참고하세요.