в моем приложении Angular у меня есть компонент:
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);
}
}
но в свойстве "делает" у меня ошибка. Я не знаю, что с этим делать ...
javascript
angular
typescript
Михаил Костюченко
источник
источник
Просто зайдите в tsconfig.json и установите
"strictPropertyInitialization": false
чтобы избавиться от ошибки компиляции.
В противном случае вам нужно инициализировать все ваши переменные, что немного раздражает
источник
!
к имени переменной постфиксный оператор, чтобы просто игнорировать этот случай, или инициализировать переменную внутри конструктора.Это потому, что TypeScript 2.7 включает строгую проверку классов, в которой все свойства должны быть инициализированы в конструкторе. Обходной путь - добавить в
!
качестве постфикса к имени переменной:источник
Мы можем получить сообщение
Property has no initializer and is not definitely assigned in the constructor
при добавлении некоторой конфигурации вtsconfig.json
файл, чтобы проект Angular был скомпилирован в строгом режиме:"compilerOptions": { "strict": true, "noImplicitAny": true, "noImplicitThis": true, "alwaysStrict": true, "strictNullChecks": true, "strictFunctionTypes": true, "strictPropertyInitialization": true,
Действительно, компилятор затем жалуется, что переменная-член не определена перед использованием.
В качестве примера переменной-члена, которая не определена во время компиляции, переменная-член, имеющая
@Input
директиву:Мы могли бы заставить компилятор замолчать, указав, что переменная может быть необязательной:
Но тогда нам пришлось бы иметь дело со случаем, когда переменная не была определена, и загромождать исходный код некоторыми такими операторами:
if (this.userId) { } else { }
Вместо этого, зная, что значение этой переменной-члена будет определено во времени, то есть она будет определена перед использованием, мы можем сказать компилятору, чтобы он не беспокоился о том, что она не будет определена.
Чтобы сообщить об этом компилятору, нужно добавить
! definite assignment assertion
оператор, например:Теперь компилятор понимает, что эта переменная, хотя и не определена во время компиляции, должна быть определена во время выполнения и во время, прежде чем она будет использована.
Теперь приложение должно убедиться, что эта переменная определена перед использованием.
В качестве дополнительной защиты мы можем утверждать, что переменная определяется, прежде чем использовать ее.
Мы можем утверждать, что переменная определена, то есть требуемая привязка ввода была фактически предоставлена вызывающим контекстом:
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(); }
Зная, что переменная была определена, теперь ее можно использовать:
ngOnChanges() { this.userService.get(this.userId) .subscribe(user => { this.update(user.confirmedEmail); }); }
Обратите внимание, что
ngOnInit
метод вызывается после попытки привязки ввода, даже если привязкам не был предоставлен фактический ввод.В то время как
ngOnChanges
метод вызывается после попытки привязки ввода, и только в том случае, если привязкам был предоставлен фактический ввод.источник
Вам нужно либо отключить то,
--strictPropertyInitialization
что упоминал Саджитаран, либо сделать что-то вроде этого, чтобы удовлетворить требование инициализации:источник
Вы также можете сделать следующее, если действительно не хотите инициализировать его.
источник
Когда вы обновляете с помощью typescript@2.9.2, его компилятор строго соблюдает правила для объявления типа массива внутри конструктора класса компонента.
Чтобы исправить эту проблему, либо измените код, который объявлен в коде, либо избегайте добавления компилятором свойства "strictPropertyInitialization": false в файл "tsconfig.json" и снова запустите npm start.
Angular Разработка веб-приложений и мобильных приложений вы можете посетить на сайте www.jtechweb.in
источник
Начиная с TypeScript 2.7.2, вы должны инициализировать свойство в конструкторе, если оно не было присвоено в момент объявления.
Если вы переходите с Vue, вы можете попробовать следующее:
Добавьте
"strictPropertyInitialization": true
в свой tsconfig.jsonЕсли вас не устраивает его отключение, вы также можете попробовать это
makes: any[] | undefined
. Для этого необходимо получить доступ к свойствам с помощью?.
оператора null check ( ), т.е.this.makes?.length
makes!: any[];
, это говорит TS, что значение будет присвоено во время выполнения.источник
Разве вы не можете просто использовать утверждение с определенным назначением? (См. Https://www.typescriptlang.org/docs/handbook/release-notes/typescript-2-7.html#definite-assignment-assertions. )
т.е. объявление свойства как
makes!: any[];
The! гарантирует, что машинописный текст определенно будет иметь значение во время выполнения.Извините, я не пробовал это в angular, но у меня это отлично сработало, когда у меня была точно такая же проблема в React.
источник