Programação · FUNDATEC · 2023 | Questão sqc-qq897126

ProgramaçãoFrameworks em Programação

Código: qq897126
Banca: FUNDATEC
Órgão: PROCERGS
Ano: 2023
Nível: Superior

Cargo: ANC - Analista em Computação - Ênfase em Desenvolvimento Front-End

Analise o código abaixo que demonstra um trecho de interface desenvolvida com o framework IONIC.<ion-list> <ion-item *ngFor="let item of items" (click)="onItemClick(item)"> <ion-label>{{ item.name }}</ion-label> <ion-note slot="end">{{ item.quantity }}</ion-note> <ion-icon slot="end" [name]="item.icon"></ion-icon> </ion-item> </ion-list> <ion-text *ngIf="items.length === 0"> Não há itens na lista. </ion-text> Sobre o funcionamento e resultado desse código, analise as assertivas abaixo: I. A diretiva ngFor é usada para iterar sobre a lista de itens e renderizar um componente ion-item com a concatenação de todos eles. II. Ao clicar em um item, será acionado um método que tem como parâmetro o objeto do item selecionado com seus dados. III. A diretiva ngIf serve para exibir um texto informando que a lista está vazia caso não haja nenhum item na lista. IV. Na tag <ion-icon> será exibido um ícone que pode ser adicionado através de diferentes bibliotecas, tais como Ionicons e FontAwesome, indicando-se apenas o nome do ícone, sem inserção de uma imagem específica. Quais estão corretas?

AApenas I e II.
BApenas III e IV.
CApenas I, III e IV.
DApenas II, III e IV.
EI, II, III e IV.

Revelar gabarito e comentário

GabaritoD — Apenas II, III e IV.

Comentário gerado por IA. É um apoio ao estudo, ancorado em fontes, mas pode conter imprecisões — confira sempre na fonte oficial (lei, súmula, edital e gabarito da banca). Encontrou um erro? Use “Reportar”.

Análise do código Ionic com Angular

Gabarito: letra D — apenas II, III e IV estão corretas. A diretiva ngFor itera sobre a lista e renderiza um ion-item para cada elemento, não concatena todos. Já o ngIf exibe condicionalmente o texto quando a lista está vazia. O evento (click) passa corretamente o item como parâmetro, e o ion-icon usa o atributo name para exibir ícones de bibliotecas como Ionicons e FontAwesome.

Afirmativa	Correta?	Justificativa
I. A diretiva ngFor é usada para iterar sobre a lista de itens e renderizar um componente ion-item com a concatenação de todos eles.	❌ Incorreto	O `ngFor` cria um `ion-item` para cada* elemento do array, não concatena todos em um único componente.
II. Ao clicar em um item, será acionado um método que tem como parâmetro o objeto do item selecionado com seus dados.	✅ Correto	O binding `(click)="onItemClick(item)"` passa o objeto `item` como argumento para o método.
III. A diretiva ngIf serve para exibir um texto informando que a lista está vazia caso não haja nenhum item na lista.	✅ Correto	`*ngIf="items.length === 0"` exibe o texto condicionalmente quando o array está vazio.
IV. Na tag `<ion-icon>` é possível usar ícones de bibliotecas como Ionicons e FontAwesome.	✅ Correto	O atributo `name` do `<ion-icon>` suporta Ionicons e também FontAwesome, entre outras.

Item I — ❌ Incorreto

A assertiva diz que o ngFor "renderiza um componente ion-item com a concatenação de todos eles". Na verdade, a diretiva *ngFor cria um novo elemento ion-item para cada item do array, não concatena em um único componente. O resultado são múltiplos ion-item, um abaixo do outro.

Item II — ✅ Correto

O binding (click)="onItemClick(item)" associa o evento de clique ao método onItemClick, passando como argumento o objeto item correspondente. Isso permite que o método receba os dados do item clicado.

Item III — ✅ Correto

A diretiva *ngIf="items.length === 0" exibe o <ion-text> apenas quando o array items estiver vazio, mostrando a mensagem "Não há itens na lista." Funciona como esperado.

Item IV — ✅ Correto

No Ionic, o componente <ion-icon> aceita o atributo name para especificar o ícone. Por padrão suporta Ionicons, mas também pode usar FontAwesome e outras bibliotecas, bastando indicar o nome do ícone. Não é necessário inserir uma imagem específica.

NÃO CAIA NESSA!

Item I — O candidato pode entender "concatenação" como se o ngFor agrupasse todos os itens num único ion-item, mas o correto é que ele gera um ion-item para cada elemento do array, formando uma lista vertical.

Conclusão: Estão corretos os itens II, III e IV. Portanto, gabarito letra D.

Link permanente: /questoes/qq897126