Estou trabalhando em uma tabela utilizando a bilioteca ng2-smart-table e estou com uma dificuldade em passar para um componente customizado os valores inseridos na linha de edição:
Veja o código abaixo, gostaria de passar para o componente SmartTableEditorFunctionsComponent os valores de Temperatura Máxima e Minima ao inserir uma nova linha na tabela.
temperaturaMaxima: {
type: 'number',
title: 'Temperatura Máxima',
},
temperaturaMinima: {
title: 'Temperatura Mínima',
type: 'number',
},
temperaturaMedia: {
title: 'Temperatura Média',
type: 'number',
editor: {
type: 'custom',
component: SmartTableEditorFunctionsComponent,
valuePrepareFunction(instance) {
instance.save.subscribe();
},
},
},
Imagem da tabela:
Criei um botão para tentar recuperar o valor, porem sem sucesso.
Código do componente:
export class SmartTableEditorFunctionsComponent extends DefaultEditor {
@Input() value: string | number;
@Input() rowData: any;
@Output() save: EventEmitter<any> = new EventEmitter();
constructor() {
super();
}
getPlaceholder(value: any) {
const id = value.column.temperaturaMaxima;
return id;
}
test() {
const id = this.rowData.temperaturaMaxima;
alert('TESTE' + id);
}
}
Código do template do componente:
{{ cell.newValue }}
<input
type="number"
[(ngModel)]="cell.newValue"
[name]="cell.getId()"
[placeholder]="cell.getTitle()"
[disabled]="!cell.isEditable()"
(click)="onClick.emit($event)"
/>
<button (click)="test()">Pega Valor</button>
Alguém poderia me ajudar?
Boa tarde a todos, estou tentando fazer um autocomplete com suggestion e uso o TypeScript, vi esta aplicação no youtube mas sem utilizar o TypeScript.
Quando rodo a aplicação ela funciona, mas mostra erro na pagina quando é carregada, por causa da falta de tipagem, gostaria de saber como fazer.
A aplicação funciona assim:
carrego os nomes que tenho no banco de dados vindos do back:
useEffect(() => {
const loadUsers = async() => {
const response = await api.get('/cadastrousuarios');
setUsers(response.data);
console.log(response.data);
}
loadUsers();
}, []);
na propriedade do input onChange eu chamei onChangeHandler:
<input type='text' className='col-md-12 input' onChange={(e: ChangeEvent<HTMLInputElement>) => onChangeHandler(e.target.value)} value={text}/>
É no onChangeHandler que esta o problema, o código pega o valor que do get em .json e procura na coluna_nome os valores que são inputados no input e mostra as sugestões:
const onChangeHandler = (text: any) => {
let matches: React.SetStateAction<never[]>= [];
if (text.length>0){
matches = users.filter( user => {
const regex = new RegExp(`${text}`, 'ig');
return user.coluna_nome.match(regex);
})
}
setSuggestions(matches)
setText(text)
}
no return user.coluna_nome.match(regex) da erro no .coluna_nome. o erro é: Property 'coluna_nome' does not exist on type 'never'.ts(2339).
Sei que é problema de tipagem mas não sei como fazer a tipagem desse item, poderiam me ajudar por favor.
Obs: Quando abro a pagina da erro por causa dessa tipagem, mas eu fecho o erro e funciona certinho!