Os Ãcones no Ionic sãeste uma implementação própria do que chamamos por icon fonts, ou seja, fontes que conté especialmentem sÃmbolos ao invés do texto ou números e qual podem ser estilizados utilizando CSS.
Previamente de passarmos de modo a a próxima etapa, vamos incluir 1 evento nas cé especialmentelulas. Faça a seguinte modificação em home.html:
Apesar de Teor minha e sua barra do buscas funcionando perfeitamente, a cada caractere digitado estamos emitindo uma nova requisiçãeste, este de que é desnecessário.
Se você ficou curioso A cerca de a criaçãeste do aplicativos multiplataforma de que utilizam tecnologia da web, saiba de que o Ionic não é a única opçãeste existente. Leia o post A cerca de React Native e descubra saiba como já é possÃvel criar uma aplicaçãeste 100% nativa utilizando JavaScript.
Possui Ainda mais uma coisa de que está incomodando: Perceba de que ESTES posts desprovido imagens estãeste quebrando nosso layout e deixando a minha e sua lista usando aspecto pouco profissional. Vamos mudar isso contendo o seguinte trecho de Palavra dentro do mfoitodo subscribe do fecthContent:
Doravante qual você já sabe Muito mais ou menos tais como as coisas funcionam, vamos tomar rapidamente uma requisição à uma API externa (Reddit) de modo a exibir seu resultado em uma lista pelo nosso template.
A nossa caixa por diálogo inclui 1 spinner e um texto indicativo por padrãeste, contudo todas essas opções podem possibilitar ser customizadas para atender melhor a necessidade do seu app.
Pelo nosso caso, este decorador está dizendo qual as modificações pelo html serão feitas apenas no componente page-home e de que o arquivo, ou mesmo que, este template html qual iremos utilizar, se chama home.html, Aprecie:
Dessa forma elas podem vir a ser reutilizadas, o que evita uma sobrecarga por memória (comportamento muito similar ao do uma ListView pelo iOS). Para entender melhor Acerca tais como utilizar este Virtual Scroll, visite este link.
data.domain Observe que ESTES Ãcones somente Seroada aplicados no caso de coincidirem usando os argumentos. Em caso contrário, será exibido mal o texto desprovido nenhum Ãcone, conforme descrito na cláusula ngSwitchDefault.
Para aplicativos qual utilizam listas e exibem conteúdo sob demanda é uma excelente prática adicionar algum recurso de Parecer para que o usuário procure informações com base em você pode olhar aqui uma palavra especÃVive ou sequência de caracteres. Para tal, este Ionic fornece 1 componente chamado SearchBar.
Tais como você percebeu, dentro do nosso arquivo home.ts há uma referência ao template home.html dentro do bloco @Component. Esse template, na verdade, é aquilo de que o usuário realmente vê na tela do seu smartphone, com base no qual definimos dentro da minha e sua classe. Por enquanto ele nãeste está exibindo nada. Modifique este conteúdo do home.html dependendo de abaixo:
Em seguida, pegamos o array resultante da requisição e adicionamos pelo fim do array original atravé especialmentes do mé especialmentetodo concat do JavaScript. Note também igualmente similarmente identicamente conjuntamente qual utilizamos o mfoitodo complete do componente, indicando qual o mesmo deve ser removido da view.
Note qual este atributo src da tag de imagem está envolto por colchetes. Essa sintaxe se chama Property binding