Vscode-ng-language-service: Pelindung tipe tidak dikenali di elemen bersarang

Dibuat pada 4 Agu 2020 · 3Komentar · Sumber: angular/vscode-ng-language-service

Jelaskan bugnya

Saat komponen menggunakan fungsi yang mengembalikan predikat tipe (type guard), editor menampilkan kesalahan terkait dengan bidang yang hilang, meskipun bidang itu ada dan kode dikompilasi (Angular v8.2).

Untuk Mereproduksi
Gunakan penjaga tipe di *ngIf . Coba gunakan bidang dari antarmuka yang ditentukan olehnya dalam elemen bersarang.

// my-model.model.ts
type MyModel = (MyModelA | MyModelB) & { type: 'A' | 'B' };
interface MyModelA {  
  fieldA: any;
}
interface MyModelB {
  fieldB: any;
}

// foo.component.ts
public model: MyModel;
public isModelA(model): model is MyModelA {
  return model.type === 'A';
}

// foo.component.html


md5-1956e8def7f34e35cec69338ae3e15c2

Perilaku yang diharapkan

Tidak ada kesalahan dalam editor.

bug ivy

Sumber

JoannaFalkowska

👍6

Semua 3 komentar

penjaga tipe yang sama tidak berlaku untuk konteks dalam layanan bahasa (mereka tampaknya berlaku saat mengkompilasi seperti ini)

export class NgLetContext<T = any> {
  // allows syntax "foo; let bar"
  $implicit: T = null!;
  // allows syntax "foo as bar"
  ngLet: T = null!;
}
@Directive({
  selector: '[ngLet]',
})
export class NgLetDirective<T> implements OnInit {
  @Input()
  set ngLet(value: T) {
    this.context.$implicit = this.context.ngLet = value;
  }

  constructor(private containerRef: ViewContainerRef, private templateRef: TemplateRef<NgLetContext>) {}
  private context = new NgLetContext<T>();

  static ngTemplateContextGuard<T>(dir: NgLetDirective<T>, ctx: unknown): ctx is NgLetContext<T> {
    return true;
  }

  ngOnInit() {
    this.containerRef.createEmbeddedView(this.templateRef, this.context);
  }
}

interface MyModel  { baz: ExampleValue }
// foo.component.ts
public model: MyModel;

<div *ngLet="model.baz as item">
   {{ item }}
</div>

Dalam jenis layanan bahasa (arahkan tooltip di vscode ke atas item setidaknya di dalam {{ }} ) adalah any

Saat kompilasi, ketik dengan benar ExampleValue

bbarry pada 17 Sep 2020

👍1

Ini adalah sesuatu yang akan diperbaiki di layanan bahasa asli Ivy yang akan datang (lihat https://github.com/angular/vscode-ng-language-service/issues/335#issuecomment-693545000), tetapi bukan sesuatu yang kami rencanakan perbaiki sebelum itu karena keterbatasan yang melekat pada implementasi layanan bahasa saat ini.

ayazhafiz pada 3 Des 2020

👍1

Seperti yang disebutkan Ayaz, ini diselesaikan di Layanan Bahasa baru yang telah dirilis di v11.1 sebagai keikutsertaan. Anda dapat mengaktifkannya di pengaturan ekstensi: