Seguindo a aula 5, do módulo 3 de TypeScript. Estou obtendo erros ao implementar decorator @domInjector.
este é o código do decorator:
export function domInjector(seletor: string) {
return function (target: any, propertyKey: string) {
console.log(`Modificando prototype ${target.constructor.name}
e adicionando getter para a propriedade ${propertyKey}`);
const getter = function () {
const elemento = document.querySelector(seletor);
console.log(`buscando elemento do DOM com o seletor
${seletor} para injetar em ${propertyKey}`);
return elemento;
}
Object.defineProperty(
target,
propertyKey,
{ get: getter }
);
}
}
Este é o início do código de negociaçao-contoller onde está sendo implementado o decorator @domInjector:
import { inspect } from "../decorators/inspect.js";
import { logarTempoDeExecucao } from "../decorators/logar-tempo-de-execucao.js";
import { DiasDaSemana } from "../enums/dias-da-semana.js";
import { Negociacao } from "../models/negociacao.js";
import { Negociacoes } from "../models/negociacoes.js";
import { MensagemView } from "../views/mensagem-view.js";
import { NegociacoesView } from "../views/negociacoes-view.js";
export class NegociacaoController {
@domInjector('#data')
private inputData: HTMLInputElement;
@domInjector('#quantidade')
private inputQuantidade: HTMLInputElement;
@domInjector('#valor')
private inputValor: HTMLInputElement;
private negociacoes = new Negociacoes();
private negociacoesView = new NegociacoesView('#negociacoesView');
private mensagemView = new MensagemView('#mensagemView');
constructor() {
this.negociacoesView.update(this.negociacoes);
}
antes de modificar o código para a implementação do @domInjector no constructor havia a declaraçao das variáveis:
export class NegociacaoController {
private inputData: HTMLInputElement;
private inputQuantidade: HTMLInputElement;
private inputValor: HTMLInputElement;
private negociacoes = new Negociacoes();
private negociacoesView = new NegociacoesView('#negociacoesView');
private mensagemView = new MensagemView('#mensagemView');
constructor() {
this.inputData = document.querySelector('#data') as HTMLInputElement;
this.inputQuantidade = document.querySelector('#quantidade') as HTMLInputElement;
this.inputValor = document.querySelector('#valor') as HTMLInputElement;
this.negociacoesView.update(this.negociacoes);
}
e elas funcionavam normalmente, como na máquina do professor, pois tive que adicionar isso no tsconfig.json:
{
"compilerOptions": {
"outDir": "app/dist/js",
"target": "ES6",
"noEmitOnError": true,
"noImplicitAny": true,
"removeComments": true,
"strictNullChecks": true,
"experimentalDecorators": true,
"strict": true,
"forceConsistentCasingInFileNames": true
},
"include": ["app/src/**/*"]
}
Em específico, essa linhas que não estão no código do professor:
"strict": true,
"forceConsistentCasingInFileNames": true
removia esse erro e alert que aparecia em meu terminal desde o começo do módulo 3 do curso de typeScript:
The compiler option "strict" should be enabled to reduce type errors. Ln 2, Col 6
The compiler option "forceConsistentCasingInFileNames" should be enabled to reduce issues when working with different OSes. Ln 2, Col 6
Enfim, o problema está que ao implementar o @domInjector e remover a declaraçao das variáveis no constructor. Aparece esse erro no terminal:
A propriedade 'inputData' não tem nenhum inicializador e não está definitivamente atribuída no construtor. Ln 12, Col 13
A propriedade 'inputQuantidade' não tem nenhum inicializador e não está definitivamente atribuída no construtor. Ln 14, Col 13
A propriedade 'inputValor' não tem nenhum inicializador e não está definitivamente atribuída no construtor. Ln 16, Col 13
Esse erro some, se eu remover as configurações iniciais que tive que implementar no tsconfig.json. Em contrapartida aqueles erros do começo do curso voltam a ser exibidos no terminal. Configurações iniciais mensionadas:
"strict": true,
"forceConsistentCasingInFileNames": true
Estás configurações iniciais que comentei não existem no código do professor. Eu estou iniciando por agora, e não tenho a experiência e os conhecimentos necessários para lidar com este tipo de problema.
Quero deixar claro, que o código sem estas configurações iniciais, continuam rodando como o do professor. A questão é que em meu terminal consta que há estes dois problemas.