Pesquisar na Comunidade
Mostrando resultados para as tags ''angular''.
Encontrado 9 registros
-
Pegar valor da tabela em um componente Angular
araujoitalo postou um tópico no fórum Desenvolvimento frontend
Olá a todos! 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?-
- typescript
- angular
-
(e mais 1 )
Tags:
-
Pegar valor da tabela em um componente Angular
araujoitalo postou um tópico no fórum Desenvolvimento frontend
Olá a todos! 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?-
- typescript
- angular
-
(e mais 1 )
Tags:
-
angular Agm-map dando erro em localhost e no servidor
Guilherme Costa Lopes postou um tópico no fórum Javascript
Estou usando o AgmCoreModule, para marcar endereços no google maps. No module, no import imports: [ AgmCoreModule.forRoot({ apiKey: 'xxxxxxxxxxx' }), ] no export exports: [ AgmCoreModule ] No ts texto = 'teste'; lat = -19.91506; lng = -44.00752; zoom = 15; No html <agm-map [latitude]="lat" [zoom]="zoom" [longitude]="lng"> <agm-marker [latitude]="lat" [longitude]="lng"></agm-marker> </agm-map> A principio ele mostra Mas depois dá este erro Ou este erro No servidor está dando este erro. O Chave key está liberada main.cb562ea7df40e3f09b5f.bundle.js:2 Refused to load the script 'https://maps.googleapis.com/maps/api/js?v=quarterly&callback=agmLazyMapsAPILoader&key=AIzaSyCD54jiJhEBda5MtJkgFJB-hfR6dv5V9jw&language=pt' because it violates the following Content Security Policy directive: "script-src 'self' 'unsafe-inline' 'unsafe-eval' https://storage.googleapis.com". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback. main.cb562ea7df40e3f09b5f.bundle.js:2 ERROR Error: Uncaught (in promise): Event: {"isTrusted":true} at x (main.cb562ea7df40e3f09b5f.bundle.js:2) at x (main.cb562ea7df40e3f09b5f.bundle.js:2) at main.cb562ea7df40e3f09b5f.bundle.js:2 at e.invokeTask (main.cb562ea7df40e3f09b5f.bundle.js:2) at Object.onInvokeTask (main.cb562ea7df40e3f09b5f.bundle.js:2) at e.invokeTask (main.cb562ea7df40e3f09b5f.bundle.js:2) at t.runTask (main.cb562ea7df40e3f09b5f.bundle.js:2) at y (main.cb562ea7df40e3f09b5f.bundle.js:2) at t.invokeTask [as invoke] (main.cb562ea7df40e3f09b5f.bundle.js:2) at u (main.cb562ea7df40e3f09b5f.bundle.js:2) O que pode ser ? -
angular Download de qualquer arquivo em angular 9
Guilherme Costa Lopes postou um tópico no fórum Javascript
component download(idArquivo: number): void { this.arquivosService.downloadArquivoOrcamento(idArquivo).subscribe( data => { const blob = new Blob([data.arquivo], { type: 'text/json; charset=utf-8' }); const url= window.URL.createObjectURL(blob); window.open(url); }, err => { console.error(err); } ) } Service import { HttpClient, HttpHeaders } from '@angular/common/http'; import { Injectable } from '@angular/core'; import { SERVER_API_URL } from 'app/app.constants'; import { Observable } from 'rxjs'; @Injectable({ providedIn: 'root' }) export class ArquivosService { constructor( private http: HttpClient ) {} downloadArquivoOrcamento(id: number, tipo: string): Observable<any> { return this.http.get(SERVER_API_URL + '/api/orcamento-anexo/' + id, { responseType: 'blob', headers: new HttpHeaders().append('Content-Type', tipo) }); } } Retorno do backend Não retorna o arquivo conforme imagem anterior Dowload com erro Já pesquisei e fiz alguma alteração, mas não achei a solução. O que quero é simples. O arquivo vem do backend em bytesm nome e content-type. Só quero fazer o dowload. O que pode ser ? -
.net core Atualização ASP.NET Core 2.0 para 3.1 - API não recebe mais os parâmetros do método POST
rdavisp postou um tópico no fórum .NET
Senhores, boa tarde.Pesquisei muito antes de abrir esse post, inclusive aqui, neste fórum. Encontrei dúvidas parecidas as quais tentei adaptar ao meu caso porem sem sucesso.A questão é a seguinte:Foi desenvolvida uma API em ASP.NET Core 2.0, mas por algumas solicitações do cliente, necessitei migrar para a versão 3.1. Existe uma SPA em Angular 7 que faz a requisição à API através de um método POST passando os parâmetros para a API que retornava um conjunto de dados para aplicação montar a tela. Após a atualização parou de funcionar! Por isso, gostaria de pedir a ajuda de vocês, por que, eu já esgotei as minhas tentativas.**No Controller da API está da seguinte maneira:** 1 2 3 4 5 6 7 8 [HttpPost] [Route("api/[controller]")] public IGResult Post(Filtro filtro) { Console.WriteLine("filtro: " + filtro); var app = new IgApplication(); return app.getInstrucoes(filtro); } **E no angular se encontra dessa forma:** 1 return this._http.post<IgResult>(environment.url + 'api/IG', this.Filtro, options) Ao debugar a API, percebo que os dados do parâmetro **body** chegam nulos. Já tentei das seguintes maneiras abaixo, mudar a implementação do POST na API porém sem sucesso: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 > //public async Task<IActionResult> Post([FromBody] Filtro pessoa) > //public HttpResponseMessage Post(Filtro pessoa) > //public async Task<ActionResult<IList<Todo>>> Create([FromBody]TodoCreateViewModel model) > //public Task<IActionResult> Post([FromBody] Filtro filtro) > //public ActionResult<Filtro> Post([FromBody] Filtro filtro) > //public HttpResponseMessage Post(Filtro filtro) > //public string Post([FromBody] Filtro filtro) > //public IActionResult Post([FromBody] Filtro filtro) > //{ > //var app = new IgApplication(); > //return app.getInstrucoes(filtro); > //return null;// Json(filtro); > //} > //public async System.Threading.Tasks.Task<string> Post(HttpRequestMessage request) > //{ > // string body = await request.Content.ReadAsStringAsync(); > // return body; > //} Por isso se possível, gostaria muito de contar com a colaboração de vocês.Desde já muito obrigado! -
ASP.NET Core API para acesso a mais de uma apicação em Angular
rdavisp postou um tópico no fórum .NET
Senhores, bom dia. Mais uma vez recorro a ajuda de vocês para algo que não domino ainda. Vamos lá! Tenho uma API que quando startada, ela sobe no seguinte endereço: http://localhost:49013/api/values. Percebi que isto é parametrizado no arquivo launchSettings.json, que está assim: { "iisSettings": { "windowsAuthentication": false, "anonymousAuthentication": true, "iisExpress": { "applicationUrl": "http://localhost:49013/", "sslPort": 0 } }, "profiles": { "IIS Express": { "commandName": "IISExpress", "launchBrowser": true, "launchUrl": "api/values", "environmentVariables": { "ASPNETCORE_ENVIRONMENT": "Development" } }, "Cliente.IG.WebAPI": { "commandName": "Project", "launchBrowser": true, "launchUrl": "api/values", "environmentVariables": { "ASPNETCORE_ENVIRONMENT": "Development" }, "applicationUrl": "http://localhost:49012/" } } } No meu controller da API, tenho seguinte método dentro do namespace: [Produces("application/json")] [Route("api/IG")] [ApiController] public class IGController : Controller { [HttpPost] public IGResult Post([FromBody] Filtro filtro) { var app = new IgApplication(); return app.getInstrucoes(filtro); } } O "IgApplication" cria uma instância da classe onde é gerado uma lista que é populada com os valores atribuídos do DAO. Quando inicializo a aplicação "A" em angular através do localhost (http://localhost:4200/). Dentro do meu arquivo environment.prod.ts tenho a chamada: export const environment = { production: true, url: 'http://localhost:49013/' }; Ela passa por esse controller e segue o fluxo e faz o que tem que ser feito. Porém, eis a questão! Eu possuo a aplicação "B", que acessa a mesma API porém possui funcionalidades diferente, por isso, dentro do mesmo controller eu criei uma nova classe e um método: [Produces("application/json")] [Route("api/Item")] public class APIIgItemController : Controller { [HttpGet] public ItensResult Post([FromBody] Itens ValorItem) { var app = new CRUDApplication(); return app.GetItens(); } } Como faço para quando for startar a aplicação "B", ele passe por esse método "ItensResult" ao invés "IGResult", sendo que ambas são executadas pelo localhost:4200? Ou isso eu defino na aplicação angular? Vi que é possível configurar mais de uma "applicationUrl" dentro do json. Devo considerar essa configuração? Grato a quem puder ajudar! -
angular PRojeto de CRUD não esta adicionando o registro no Banco
brunopeople postou um tópico no fórum Javascript
Eu estou fazendo um projeto de CRUD consumindo uma API Restfull com banco de dados mongoDB para uma teste de vaga de emprego, eu fiz a aplicação e ela roda sem erros nenhum, porém ao adicionar o registro do post ele não está adicionando o registro no banco de dados? Eu não consegui realmente encontrar o erro do por que isto está acontencendo ou por que? eu gostaria muito de alguém me ajudasse. https://github.com/brunopeople/Teste-RedFox-Full-Stack- 1 resposta
-
- mongodb
- javascript
-
(e mais 2 )
Tags:
-
Boa tarde, Estou tendo dificuldade pra carregar uma tela de edição de usuários, mais especificamente pra carregar os perfis, que são dinâmicos e apresentados como checkboxes. Eu tenho essa três entidades: Usuário: export class Usuario { id: number; nome: string; telefone: string; email: string; } Perfil: export class Perfil { id: number; nome: string; } UsuarioPerfil (tabela que relaciona quais perfis o usuário tem) export class UsuarioPerfil { id: number; idUsuario: number; idPerfil: number; } Inicialmente eu carrego todos os perfis da base e os apresento como checkboxes no trecho de ngOnInit abaixo. São apresentados assim no banco, por exemplo: ID_USUARIO ID_PERFIL 98 8 98 9 Isso quer dizer que o usuário 98 tem os perfis de Usuario(8) e N1(9). Então eu gostaria de alguma maneira de, conforme eu for iterando os checkboxes no loop do html eu chamasse a função do spring passando so id do perfil e o id do usuário (98) e (caso voltasse ok do serviço (quando passar 8 e 9, que são os que existem), eu marcasse o checkbox como “checked”. Ou alguma outra solução mais adequada. Como eu poderia fazer isso? HTML: <h3>Alterar Usuario</h3> <div [hidden]="submitted" style="width: 400px;"> <form (ngSubmit)="onSubmit()"> <div class="form-group"> <label for="name">Nome</label> <input type="text" class="form-control" id="nome" required [(ngModel)]="usuario.nome" name="nome"> </div> <div class="form-group"> <label for="telefone">Telefone</label> <input type="text" class="form-control" id="telefone" required [(ngModel)]="usuario.telefone" name="telefone"> </div> <div class="form-group"> <label for="email">Email</label> <input type="text" class="form-control" id="email" required [(ngModel)]="usuario.email" name="email"> </div> <h4>Perfis</h4> <table class="table table-striped"> <thead> </thead> <tbody> <tr *ngFor="let perfil of perfilData"> <input type='checkbox' id="perfil{{perfil.id}}" > {{perfil.nome}} </tr> </tbody> </table> <button type="submit" class="btn btn-success">Submit</button> </form> </div> TS: import { Component, OnInit } from '@angular/core'; import { Usuario } from '../usuario'; import { ActivatedRoute, Router } from '@angular/router'; import { UsuarioService } from '../usuario.service'; import { PerfilService } from './../perfil.service'; import { Perfil } from "./../perfil"; import { UsuarioPerfilService } from './../usuarioperfil.service'; @Component({ selector: 'app-update-usuario', templateUrl: './update-usuario.component.html', styleUrls: ['./update-usuario.component.css'] }) export class UpdateUsuarioComponent implements OnInit { id: number; usuario: any; perfisservico: Observable<Perfil[]>; perfilData:any=[]; constructor(private route: ActivatedRoute,private router: Router, private usuarioService: UsuarioService, private perfilService: PerfilService, private usuarioperfilService: UsuarioPerfilService) { } ngOnInit() { this.usuario = new Usuario(); this.id = this.route.snapshot.params['id']; this.usuarioService.getUsuario(this.id) .subscribe(data => { console.log(data) this.usuario = data; }, error => console.log(error)); this.perfilService.getPerfisList() .subscribe(res=> { if (res) { this.perfisservico= res; this.perfilData = this.perfisservico; } }) } updateUsuario() { this.usuarioService.updateUsuario(this.id, this.usuario) .subscribe(data => console.log(data), error => console.log(error)); this.usuario = new Usuario(); this.gotoList(); } onSubmit() { this.updateUsuario(); } gotoList() { this.router.navigate(['/usuarios']).then(() => { window.location.reload(); }); } }
-
- angular
- springboot
-
(e mais 1 )
Tags:
-
Galera alguém pode me ajudar, eu gerei uma Build com AngularCli e tento rodar ela com o Cordova e ao inspecionar no Chrome me retorna o seguinte erro no console: main-es2015.7678d805abc29502169b.js:1 Service worker registration failed with: TypeError: Failed to register a ServiceWorker: The URL protocol of the current origin ('file://') is not supported. at g._next (main-es2015.7678d805abc29502169b.js:1) at g.__tryOrUnsub (main-es2015.7678d805abc29502169b.js:1) at g.next (main-es2015.7678d805abc29502169b.js:1) at f._next (main-es2015.7678d805abc29502169b.js:1) at f.next (main-es2015.7678d805abc29502169b.js:1) at Kl._next (main-es2015.7678d805abc29502169b.js:1) at Kl.next (main-es2015.7678d805abc29502169b.js:1) at Dl._next (main-es2015.7678d805abc29502169b.js:1) at Dl.next (main-es2015.7678d805abc29502169b.js:1) at G.notifyNext (main-es2015.7678d805abc29502169b.js:1)