0
Hello, I have a problem with typescript, I try to run a function to know if at least one of the checkbox contained in an ngFor has been selected, but the console shows me this error saying that arrayChecados.some is not a Function. Template
<table class="table">
<thead>
<tr>
<th></th>
<th>Descrição do item</th>
<th>Quantidade mensal estimada</th>
<th>Quantidade mensal real</th>
<th>Valor unitário</th>
<th>Valor mensal real do item</th>
<th class="thAcoes">
<div style="text-align: center;">Ações</div>
</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let fechamento of arrayFechamentos"
[class.autorizado]="fechamento.padAutorizado"
[class.auditoria]="fechamento.padAuditoria" [class.glosado]="fechamento.padGlosado">
<td><input type="checkbox" name="alternancia" id="" (change)="ativarBotao()"></td>
<td>{{ fechamento?.padPaciente[0].descricaoItemPad.descricao }}</td>
<td>{{ fechamento?.padPaciente[0].quantidadeMensal }}</td>
<td>{{ fechamento?.quantidadeMensalReal }}</td>
<td>{{ fechamento?.padPaciente[0].valorUnitario }}</td>
<td>{{ fechamento?.valorMensalRealItem }}</td>
<button class="btn btn-sm btn-success"
on-click="fechamento.padAutorizado = true; fechamento.padAuditoria= false; fechamento.padGlosado = false">
Aprovado</button>
<button type="button" data-toggle="modal" class="btn btn-sm btn-warning"
data-target="#modalAuditoria"
on-click="fechamento.padAuditoria = true; fechamento.padAutorizado = false; fechamento.padGlosado = false">
Auditoria</button>
<!-- Modal -->
<div class="modal fade" id="modalAuditoria" tabindex="-1" role="dialog"
aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Justificativa</h5>
<button type="button" class="close" data-dismiss="modal"
aria-label="Fechar">
<span aria-hidden="true">×</span></button>
</div>
<div class="modal-body" style="margin: auto;">
<textarea name="" id="" cols="45" rows="8"></textarea>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary"
data-dismiss="modal">Fechar</button>
<button type="button" class="btn btn-primary">Salvar mudanças</button>
</div>
</div>
</div>
</div>
<button type="button" data-toggle="modal" class="btn btn-sm btn-danger"
data-target="#modalGlosagem"
on-click="fechamento.padGlosado = true; fechamento.padAutorizado = false; fechamento.padAuditoria = false">
Glosado</button>
<!-- Modal -->
<div class="modal fade" id="modalGlosagem" tabindex="-1" role="dialog"
aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Justificativa</h5>
<button type="button" class="close" data-dismiss="modal"
aria-label="Fechar">
<span aria-hidden="true">×</span></button>
</div>
<div class="modal-body" style="margin: auto;">
<textarea name="" id="" cols="45" rows="8"></textarea>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary"
data-dismiss="modal">Fechar</button>
<button type="button" class="btn btn-primary">Salvar mudanças</button>
</div>
</div>
</div>
</div>
</tr>
</tbody>
</table>
TS:
export class DetalheFechamentoComponent implements OnInit, IComponenteBase, IDataTableBase, IModalBase {
@ViewChild('modalFechamento', { static: false }) modalFechamento: ModalDirective;
formulario!: FormGroup;
editarFechamento: boolean;
carregando: boolean;
fechamento: Fechamento;
arrayFechamentos: Array<Fechamento>;
arrayChecados: Array<any>;
constructor(
private formbuilder: FormBuilder,
private activatedRoute: ActivatedRoute, private sanitizer: DomSanitizer) {
this.arrayFechamentos = new Array<Fechamento>();
this.arrayChecados = new Array<any>();
}
AtribuirParaSalvar() {
throw new Error("Method not implemented.");
}
ngOnInit() {
}
InicializarDataTable(parametro: any) {
throw new Error("Method not implemented.");
}
ConfigurarDataTable() {
throw new Error("Method not implemented.");
}
AjustarDataTable() {
throw new Error("Method not implemented.");
}
async AtribuirParaEditar(idFechamento: string) {
this.formulario.reset();
this.editarFechamento = true;
await this.BuscarFechamentoPorId(idFechamento);
this.formulario.patchValue(this.fechamento);
}
async BuscarFechamentoPorId(idFechamento) {
/*await this.FechamentoService.Buscar(idFechamento)
.then((data: any) => {
this.Fechamento = data;
}, (error) => EmitirAlertaSwal.AlertaToastError("Verifique sua conexão"));*/
}
ExcluirValor(parametro: any) {
throw new Error("Method not implemented.");
}
AbrirModal() {
this.modalFechamento.show();
}
FecharModal() {
this.modalFechamento.hide();
}
ativarBotao() {
this.arrayChecados = document.getElementsByName('alternancia') as unknown as HTMLInputElement[];
return this.arrayChecados.some(elem => {
return elem.checked;
}) ? document.getElementById('autorizarSelecionados').classList.remove('botao-escondido') : '';
}
}
The problem is that
getElementsByName
returns a Nodelist and not an array, they are different. The biggest problem is that you should not usegetElementsByName
, is not "the Angular way of doing"– Costamilam