'…' Özelliğinin başlatıcısı yoktur ve yapıcıda kesinlikle atanmamış

Angular uygulamamda bir bileşenim var:

import { MakeService } from './../../services/make.service';
import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'app-vehicle-form',
  templateUrl: './vehicle-form.component.html',
  styleUrls: ['./vehicle-form.component.css']
})
export class VehicleFormComponent implements OnInit {
  makes: any[];
  vehicle = {};

  constructor(private makeService: MakeService) { }

  ngOnInit() {
    this.makeService.getMakes().subscribe(makes => { this.makes = makes
      console.log("MAKES", this.makes);
    });
  }

  onMakeChange(){
    console.log("VEHICLE", this.vehicle);
  }
}

ama "yapar" özelliğinde bir hata var. Onunla ne yapacağımı bilmiyorum ...

TypeScript'in en son sürümünü kullandığınızı düşünüyorum. Lütfen "Katı Sınıf Başlatma" bölümüne bakın link.

Bunu düzeltmenin iki yolu vardır:

A. VSCode kullanıyorsanız, düzenleyicinin kullandığı TS sürümünü değiştirmeniz gerekir.

B. Diziyi yapıcı içinde ilan ettiğinizde başlatın,

makes: any[] = [];

constructor(private makeService: MakeService) { 
   // Initialization inside the constructor
   this.makes = [];
}

Tsconfig.json'a gidin ve

"strictPropertyInitialization": false

derleme hatasından kurtulmak için.

Aksi takdirde, biraz can sıkıcı olan tüm değişkenlerinizi başlatmanız gerekir.

Bunun nedeni, TypeScript 2.7'nin tüm özelliklerin yapıcıda başlatılması gereken katı bir sınıf denetimi içermesidir. Geçici bir çözüm, !değişken adına sonek olarak eklemektir :

makes!: any[];

Bir Angular projesinin katı modda derlenmesi Property has no initializer and is not definitely assigned in the constructoriçin tsconfig.jsondosyaya bazı konfigürasyonlar eklerken mesajı alabiliriz :

"compilerOptions": {
  "strict": true,
  "noImplicitAny": true,
  "noImplicitThis": true,
  "alwaysStrict": true,
  "strictNullChecks": true,
  "strictFunctionTypes": true,
  "strictPropertyInitialization": true,

Aslında derleyici daha sonra bir üye değişkenin kullanılmadan önce tanımlanmadığından şikayet eder.

Derleme zamanında tanımlanmamış bir üye değişken örneği için, bir @Inputdirektif içeren bir üye değişkeni :

@Input() userId: string;

Değişkenin isteğe bağlı olabileceğini belirterek derleyiciyi susturabiliriz:

@Input() userId?: string;

Ama sonra, değişkenin tanımlanmamış olması durumuyla ilgilenmemiz ve kaynak kodunu bu tür ifadelerle karıştırmamız gerekir:

if (this.userId) {
} else {
}

Bunun yerine, bu üye değişkenin değerini bilmek zamanında tanımlanacaktır, yani kullanılmadan önce tanımlanacaktır, derleyiciye tanımlanmaması konusunda endişelenmemesini söyleyebiliriz.

Bunu derleyiciye söylemenin yolu ! definite assignment assertion, aşağıdaki gibi operatörü eklemektir :

@Input() userId!: string;

Şimdi, derleyici bu değişkenin, derleme zamanında tanımlanmamış olmasına rağmen, çalışma zamanında ve kullanılmadan önce zamanında tanımlanması gerektiğini anlar.

Bu değişkenin kullanılmadan önce tanımlanmasını sağlamak artık uygulamaya bağlıdır.

Ek bir koruma olarak, kullanmadan önce değişkenin tanımlandığını söyleyebiliriz.

Değişkenin tanımlandığını, yani gerekli girdi bağlamanın aslında çağıran bağlam tarafından sağlandığını iddia edebiliriz:

private assertInputsProvided(): void {
  if (!this.userId) {
    throw (new Error("The required input [userId] was not provided"));
  }
}

public ngOnInit(): void {
  // Ensure the input bindings are actually provided at run-time
  this.assertInputsProvided();
}

Değişkenin tanımlandığını bilerek, değişken artık kullanılabilir:

ngOnChanges() {
  this.userService.get(this.userId)
    .subscribe(user => {
      this.update(user.confirmedEmail);
    });
}

ngOnInitYöntemin giriş bağlama girişiminden sonra çağrıldığına dikkat edin , bu, bağlamalara hiçbir gerçek girdi sağlanmasa bile.

Oysa ngOnChangesyöntemi giriş bağlantıları çalışıldıktan sonra denir ve sadece bağları sağlanan gerçek giriş orada edilir.

--strictPropertyInitializationBaşlatma gereksinimini karşılamak için ya Sajeetharan'ın bahsettiği şeyi devre dışı bırakmanız ya da buna benzer bir şey yapmanız gerekir:

makes: any[] = [];

Bunu gerçekten başlatmak istemiyorsanız, aşağıdakileri de yapabilirsiniz.

makes?: any[];

TypeScript 2.7.2'den itibaren, bildirim noktasında atanmamışsa, yapıcıdaki bir özelliği başlatmanız gerekir.

Vue'dan geliyorsanız, şunları deneyebilirsiniz:

• "strictPropertyInitialization": trueTsconfig.json dosyanıza ekleyin

• Devre dışı bırakmaktan memnun değilseniz, bunu da deneyebilirsiniz makes: any[] | undefined. Bunu yapmak, özelliklere null check ( ?.) operatörüyle erişmenizi gerektirir, örn.this.makes?.length

• Deneyebilirsiniz makes!: any[];, bu TS'ye değerin çalışma zamanında atanacağını söyler.

Typescript@2.9.2 kullanarak yükselttiğinizde, derleyicisi, bileşen sınıfı yapıcısı içinde dizi türü bildirimi için katı kurallar izler.

Bu sorunu düzeltmek için ya kodda bildirilen kodu değiştirin ya da "tsconfig.json" dosyasına "tightPropertyInitialization": false özelliğini eklemek için derleyiciden kaçının ve npm start'ı yeniden çalıştırın.

Angular web ve mobil Uygulama Geliştirme www.jtechweb.in adresine gidebilirsiniz

Bir Kesin Atama Onayını kullanamaz mısınız? (Bkz. Https://www.typescriptlang.org/docs/handbook/release-notes/typescript-2-7.html#definite-assignment-assertions )

yani mülkü makes!: any[];! typcript, çalışma zamanında kesinlikle bir değer olacağını garanti eder.

Üzgünüm, bunu açısal olarak denemedim ama React'te aynı sorunu yaşarken benim için harika çalıştı.