Skip to main content

Perguntas com a tag [angular-material]

Angular Material consiste em implementação do Material Design criado pelo Google. Este apresentada uma biblioteca de componentes para efetivação de uma UI atrativa, consistente e funcional permitindo uma criação rápida e responsiva em novos projetos.

Filtrar por
Ordenado por
Com tags
0 votos
1 resposta
1mil visitas

Como deixar sidenav e toolbar fixas com angular material

Quero deixar fixo a sidenav e o toolbar do Angular Material, e o conteúdo da aplicação ficar no restante da página. Na minha index.html estou usando a diretiva ng-view pra renderizar. Tenho uma pagina ...
0 votos
1 resposta
841 visitas

Angular Material - Tabela com tamanho que se ajusta com a quantidade de dados que vem do banco

Consigo criar uma tabela no Angular, usando o Angular Material, que se adequa a quantidade de dados vinda do banco? Já usei essa tabela do código abaixo e para cada coluna definia uma tag ng-container ...
0 votos
1 resposta
292 visitas

Como pegar o atributo "aria-selected" do mat-selection-list com angular?

possuo um mat-accordion que possui um mat-selection-list de uma forma interna. Eu vi que dentro desse mat-selection-list possui um atributo que chama aria-selected, preciso pegar os dados dos ...
3 votos
1 resposta
2mil visitas

Como deixar uma div fixa acompanhando o scroll?

Estou usando AngularJs e Angular Material e preciso fazer uma div ficar fixa porém não faço a menor ideia de como fazer, minha estrutura é a seguinte: <div class="page"> <md-toolbar ...
0 votos
2 respostas
723 visitas

Alterar background color de uma row de uma table utilizando checkbox

Estou tentando alterar a cor de uma row quando um checkbox é selecionado, mas quando selecionou apenas um, o table inteira é alterada a cor, o check permanece apenas no selecionado, mas a cor é ...
2 votos
1 resposta
295 visitas

Mat-paginator fora de posição após atualização Chrome

Boa tarde pessoal, Utilizo o Angular 6.1.5 com Angular-Material 6.4.7, e a mais ou menos 2 meses, após uma atualização do Google Chrome o mat-paginator se deslocou para a posição 9 "nove" na ...
0 votos
2 respostas
544 visitas

Remover borda de menu material

Bom dia, estou usando o menu "Expansion Panel" do Material e queria remover a borda da seleção da imagem. O código no momento está assim: HTML <mat-expansion-panel-header class="sub"> <...
-1 votos
1 resposta
1mil visitas

Angular, erro no AppComponent e no AppModule, não está importando

app.component.ts import { Component } from '@angular/core'; import { AppComponent } from './app.component'; @Component({ selector: 'app-root', templateUrl: 'app.component.html' }) export class ...
3 votos
1 resposta
1mil visitas

AngularJs-Material como alterar a lingua para portugues do md-datepicker

Estou tentando trocar a linguagem do md-datepicker para português pois os dias da semana e o meses estão em inglês, portanto fica confuso para o usuário... Existe alguma forma de trocar esta linguagem?...
-1 votos
1 resposta
1mil visitas

Existe alguma forma de forçar uma opção de um <mat-option> por um service?

Basicamente tenho um mat-option, e gostaria de selecionar uma opção dele diretamente por parâmetros, com um service, por exemplo. Este é o option: <mat-select [formControl]="form.get('emptyTitle')...
-1 votos
1 resposta
3mil visitas

Angular Material 5 - Mat-Table Sort

Os campos Tipo e Data não estão ordenando em ordem decrescente ao comando do usuário, segue anexo o código .ts e html: Se alguém tem uma explicação/solução por gentileza compartilhe. import { ...
1 voto
0 respostas
48 visitas

Tem como uma imagem ocupar a tela inteira existindo um mat-card em angular?

Estou fazendo um projeto em angular, estou ainda no início do framework então não entendo muito sobre, gostaria de saber se consigo colocar uma imagem de fundo do projeto, tendo em mente que o título ...
-2 votos
1 resposta
639 visitas

mat-icon Angular don't appear

I Import the Mat-Icon from Angular, but when i use then, he does not appear. Someone helps me? Below my code: app.module: import { NgModule } from '@angular/core'; import { BrowserModule } from '@...
-2 votos
1 resposta
170 visitas

Tabela angular material sem scroll

Estou fazendo uma tabela com angular material, porém quando eu carrego os itens da tabela não aparece um scroll pra eu descer a tela. Meu HTML está assim: <table mat-table [dataSource]="...
-3 votos
1 resposta
108 visitas

Estou com esse erro e nao sei como resolver, meu angular é v.14 [fechada]

img de exemplo: inserir a descrição da imagem aqui
1 voto
1 resposta
749 visitas

Angular + Angular Material mesmo sem erro não parece nada

Ao startar minha aplicação não ocorre nenhum erro mas não aparece nada na tela. <!DOCTYPE html> <html> <base href="/"> </base> <head> <meta name="...
0 votos
0 respostas
164 visitas

input type="datetime-local" em uma mat-table - Angular

Estou usando um input type="datetime-local" dentro de uma mat-table em Angular. Porém os inputs não estão sendo populados conforme esperado. Quando tenho apenas um registro na tabela, está ...
-2 votos
1 resposta
441 visitas

Adicionar botão na tabela angular material

Como adicionar botão de editar/excluir na tabela do angular material? Aqui tem um exemplo [1]. Atualmente o código tá assim: <ng-container *ngFor="let col of columns"> <ng-...
3 votos
1 resposta
998 visitas

Mat-tab: ativar outra tab ao clicar em botão

Estou iniciando em Angular e tenho ainda dúvidas em relação a interação entre componentes. No meu caso em específico não sei como fazer, e se tem como. <mat-tab-group> <...
0 votos
1 resposta
204 visitas

Problema ao exibir informações em uma tabela com Angular

Estou criando uma tabela com mat-table do angular, mais ao exibir as linhas nenhuma informação aparece. HTML: <div> <mat-table [dataSource]="Contatos"> <ng-...
-2 votos
2 respostas
821 visitas

estou tendo problemas em meu angular angular , quando vou da um npm start ele da essa mensagem

This likely means that the library (@angular/material/snack-bar) which declares MatSnackBar has not been processed correctly by ngcc, or is not compatible with Angular Ivy. Check if a newer version of ...
0 votos
0 respostas
188 visitas

Formulário reativo Input com matInput

Implementei um campo input text que busca os elementos em uma lista, esse funcionamento está correto, porém ao digitar as palavras ele não permite espaços em nomes compostos que já estão encontrados ...
1 voto
2 respostas
4mil visitas

Angular 9 - mat-form-field must contain a MatFormFieldControl

Encontrei alguns posts na internet falando sobre este assunto, porém não achei solução para o meu caso. Tenho um form e quando inicio o APP recebo a mensagem -> mat-form-field must contain a ...
-2 votos
1 resposta
1mil visitas

Como pegar o valor atual de um select com angular

import { MatchService } from './../match.service'; import { Router } from '@angular/router'; import { Component, OnInit } from '@angular/core' import { Match } from '../match.model'; import {...
0 votos
0 respostas
49 visitas

Como acessar o método isComplete() do mat-date-range-picker no template?

Estou tentando acessar o método isComplete() do mat-date-range-picker no meu template: You should select the range date Porém estou recebendo este erro: error TS2339: Property 'isComplete' does ...
1 voto
0 respostas
110 visitas

css dynamically angular 8

Estou tendo um problema ao registrar meu css dinamico tentei deixar extensão .scss e .css mas ambas não deram certo. Theme.service.ts import { Injectable, Inject, EventEmitter } from '@angular/core'; ...
-1 votos
1 resposta
3mil visitas

Angular Material - Date picker muda a data quando tiro o foco do input [fechada]

estou enfrentando problemas no Angular. Estou usando o angular material para alguns /componentes e eu estou usando o datepicker. O meu date locale já é 'pt', aparece até o nome dos meses em portugues ...
0 votos
0 respostas
66 visitas

Colocando itens fixos em uma lista

Alguém poderia me ajudar? Estou com o seguinte problema. Tenho que colocar dois itens fixos em uma lista, já tentei usar o position fixed e sticky mas não deu certo. Vou deixar o código a abaixo. ...
0 votos
0 respostas
68 visitas

Angular 9 datatables [fechada]

Boa tarde, estou utilizando o datatable do link abaixo: https://l-lin.github.io/angular-datatables/#/welcome O único problema é atualizar o valor do grid após o update, segue imagem: Muito Obrigado.
1 voto
3 respostas
435 visitas

Validar três campos [fechada]

Tenho três campos e tenho que validar mandando a mensagem ng-mensage do primeiro campo sempre que um valor é trocado e impedindo que o form seja submetido. A soma do campo número 2 e número 3 não ...
0 votos
4 respostas
2mil visitas

Label do materialize não sobe quando populo um input

Quando busco os dados para preencher os inputs a label não sobe, ficando em cima do valor do input segue imagem. Código do form: <div class="row"> <div class="col s12 "> <...
1 voto
1 resposta
2mil visitas

Ordenar Lista de Componentes Angular

Fala Galera! Minha dúvida é a seguinte: imaginem uma DIV que dentro dela existam vários componentes como o exemplo abaixo: <div class="row"> <app-fogao></app-fogao> ...
-1 votos
1 resposta
650 visitas

Adicionar uma classe CSS a somente um elemento filho da linha da tabela

Preciso de uma ajuda, tenho uma tabela, ao clicar no checkbox de uma determinada linha, somente o nome do analista presente neste linha deve ficar com a cor vermelha, mas da forma que implementei ao ...
1 voto
2 respostas
5mil visitas

Mudar esquema de cor do Angular 9 material design

Adicionei o pacote do material design, ng add @angular/material, no meu projeto e selecionei o Deep Purple/Amber. Quero mudar a paleta de cores do meu projeto, mas não encontrei como gerar o CSS no ...
1 voto
1 resposta
273 visitas

Spinner Angular material não funciona em chamadas síncronas

Tenho uma chamada síncrona new SyncRequestClient().post<HistoricoModel,Response>(solrRequest, request); e preciso que seja criado um spinner para essa chamada. Aparecer antes de ser feita a ...
-1 votos
1 resposta
763 visitas

Erro ao executar projeto Angular

estou tentando executar uma aplicação Angular no meu ambiente de desenvolvimento, mas estou passando por alguns problemas. Clonei o repositório do projeto, executei o npm install, e ao executar um ng ...
2 votos
1 resposta
2mil visitas

Como estilizar um Mat-paginator?

Criei um mat-paginator-intl para modificar o texto do mat-paginator da seguinte forma: import { MatPaginatorIntl } from '@angular/material'; export class MatPaginatorIntlCustom extends ...
-1 votos
1 resposta
384 visitas

Não estou conseguindo atulalizar a grade no html <mat-table>

Formulario.ts import { Component, OnInit } from '@angular/core'; import { FormBuilder, Validators } from '@angular/forms'; import { MatTableDataSource } from '@angular/material/table'; import { ...
-3 votos
1 resposta
627 visitas

Ler formato Json Angular 9

minha api retorna um formato de json da seguinte forma { "Errors": [], "Result": [ { "CompanyName": "teste inicio", "FantasyName": ...
2 votos
1 resposta
2mil visitas

Mat Form Field Angular: Como manter o tamanho original da fonte quando o form-field é focado?

Estou usando Angular Material form field com input. Quando eu clico no meu form field, minha label tem a font-size diminuida. Como posso manter o tamanho original da minha label quando o form field ...
-2 votos
1 resposta
491 visitas

Translate no angular 6

Estou usando o i18n no angular, como imagem abaixo: No app.component.ts está assim: import { Component } from "@angular/core"; import { TranslateService } from "@ngx-translate/core"; @Component({ ...
0 votos
1 resposta
211 visitas

HTML sendo construido antes de retorno da api em Angular

Quero receber dados da minha API e construir cards com eles dinamicamente, para isso estou usando o 'binding' do Angular, porem meu HTML está sendo construído antes da resposta estar concluída, com ...
0 votos
1 resposta
260 visitas

Capturar dados de todos elementos select's no HTML com Angular

Fiz um ngFor para listar elementos select HTML e estou querendo capturar todos os dados selecionados por esse select... fiz da seguinte forma: app.component.html <form [formGroup]="...
0 votos
1 resposta
1mil visitas

Atualização de dados no banco refresh component angular

Queria saber como eu faço pra que toda vez que atualize os dados no banco ele atualize o component no angular ou de refresh na pagina, ou melhor que o serviço seja em tempo real. Eu já vi varias ...
0 votos
0 respostas
1mil visitas

Overflow em Material Table

Bom dia, tenho uma tabela com material table e preciso que quando quando os dados da coluna excedam seu tamanho, ela gere um scroll com overflow. Já tem um tempo que estou procurando e tentando e não ...
0 votos
1 resposta
1mil visitas

Limpar valor do input no angular material

Tenho um input no Angular Material: <mat-form-field class="width-layout p-0 col-xs-12 col-sm-4 col-md-4 col-lg-4" [class.mat-form-field-invalid]="errorValue" appearance="outline"> ...
0 votos
2 respostas
199 visitas

Receber um status e marcar como CHECKED - TypeScript

Estou recebendo um array do back, contendo os usuários do sistema. Eu exibo esse array numa tela de edição de grupos, onde exibe todos os usuários do sistema em um checkbox multiple. O que preciso ...
0 votos
1 resposta
1mil visitas

Como dar "trigger" em um Option de um Mat-select que já está selecionado?

Basicamente tenho este mat-select: <mat-select [formControl]="form.get('emptyTitle')" placeholder="Nenhum Índice Selecionado" (selectionChange)="onSelect($event)"> <...
1 voto
1 resposta
2mil visitas

Formatar o valor do input usando [ngModel] e (ngModelChange) enquanto digita

Pesquisei no SO e SOPT para ver se tinha ocorrido com alguém a mesma coisa, mas acredito que não. Tenho uma aplicação com um input para que um determinado valor seja digitado e formatado ao mesmo ...
0 votos
2 respostas
828 visitas

Mostrar Page vindo do SpringBoot no angular 6 usando Angular Material Data Table

Olá, estou iniciando em angular e gostaria de mostrar o resultado de uma pesquisa que está vindo de uma api que construi usando springboot. minha response esta vindo assim: {,…} content: [{id: 33, ...