po-angular
po-angular copied to clipboard
PoTableColumn - property - Ler um objeto JavaScript
Qual o comportamento atual?
Ao criar uma tabela(po-table) e ler um objeto JSON, gostaria de poder setar na coluna(objeto PoTableColumn) o valor que esta dentro de um objeto JavaScript, por exemplo:
Objeto:
{ client: { fantasyName: 'Nome fantasia' } }
Definição das colunas no componente.
columns: Array<PoTableColumn> = [ { property: 'client.fantasyName', label: 'Cliente' } ];
Que comportamento você esperava ver?
Exibir o valor do campo dentro do objeto. Atualmente eu precisei fazer um "forEach" e setar manualmente numa nova propriedade do objeto.
Ambiente
- Portinari: 1.13
- Angular: 8
- Browser(s): Google Chrome
- Operating System (e.g. Windows, macOS, Ubuntu): Linux
Boa! isso faz muita falta neste componente
Ola Thiago!
Esta implementação seria o que você necessita? https://stackblitz.com/edit/portinariui-ztrahf
Caso não seja você poderia dar mais detalhes do seu código?
Aguardo seu retorno, qualquer dúvida estou a disposição.
Oi Rafaelly, tudo bem ?
Seria quase isso. No caso o objeto estaria na variável "items".
`columns= [{ property: 'client.nameFantasy', label: 'Nome Fantasia' }];
items = [ { client: { nameFantasy: 'Nome do cliente' } } ];`
Att. Thiago Gonçalves dos Santos
Ola, tudo bem.
Uma dúvida para entender melhor a demanda, no caso que existem muitos itens, como saber qual deles deve ser utilizado como 'property'?
Por exemplo:
`columns= [{ property: 'client.nameFantasy', label: 'Nome Fantasia' }];
items = [ { client: { nameFantasy: 'Nome do cliente 1' } }, { client: { nameFantasy: 'Nome do cliente 2' } }, { client: { nameFantasy: 'Nome do cliente 3' } }, ]
Nesse caso, seriam criadas 3 colunas (uma para cada nameFantasy
) ?
Aguardo seu retorno.
Oi Rafaelly,
Não serio o contrário, 1 coluna com 3 linhas. Olha o exemplo que construi abaixo:
https://stackblitz.com/edit/portinariui-sewq3s
Att. Thiago Gonçalves dos Santos
On Mon, Oct 21, 2019 at 3:44 PM Rafaelly G. Schoeffel < [email protected]> wrote:
Ola, tudo bem.
Uma dúvida para entender melhor a demanda, no caso que existem muitos itens, como saber qual deles deve ser utilizado como 'property'?
Por exemplo:
`columns= [{ property: 'client.nameFantasy', label: 'Nome Fantasia' }];
items = [ { client: { nameFantasy: 'Nome do cliente 1' } }, { client: { nameFantasy: 'Nome do cliente 2' } }, { client: { nameFantasy: 'Nome do cliente 3' } }, ]
Nesse caso, seriam criadas 3 colunas (uma para cada nameFantasy) ?
Aguardo seu retorno.
— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/portinariui/portinari-angular/issues/132?email_source=notifications&email_token=ABI4XWTTHN7A63PPGLJ4G4TQPX2CPA5CNFSM4JCWTBW2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEB3LZKI#issuecomment-544652457, or unsubscribe https://github.com/notifications/unsubscribe-auth/ABI4XWRIVSKXRXHFTGFEJVLQPX2CPANCNFSM4JCWTBWQ .
-- Thiago Gonçalves dos Santos. Cel.: (47) 99136-6482
Ola Thiago! Consegui entender, obrigada pelas informações.
Encaminhei sua sugestão de melhoria para análise de nosso PO e aqui tem uma solução paliativa que imagino que seja parecida com a que você já implementou.
Qualquer dúvida estou a disposição
Link da solução paliativa: https://stackblitz.com/edit/portinariui-ztrahf
Alguma novidade sobre esta funcionalidade ?
Segue documentação do componente table do PrimeNG https://www.primefaces.org/primeng/#/table
ficaria bem legal se pudesse ler as propriedades de um objeto como no PrimeNG exemplo: cliente.nome cliente.endereco cliente.nomeFantasia
Tive o mesmo problema, como solução paliativa usei Cell Template, mas acredito que a melhor forma seria poder setar direto no 'property' como já mencionado acima.
Minha solução paliativa:
const pessoa = {
"codigo": 1,
"nome": "João Silva",
"endereco": {
"logradouro": "Rua do Abacaxi",
"numero": "10",
"complemento": null,
"bairro": "Brasil",
"cep": "38.400-121",
"cidade": "Uberlândia",
"estado": "MG" },
"ativo": true
}
readonly colunas: Array<PoTableColumn> = [
{ property: 'codigo', label: 'Cógido' },
{ property: 'nome', label: 'Nome' },
{ property: 'cidade', label: 'Cidade', type: 'cellTemplate' },
{ property: 'estado', label: 'Estado', type: 'cellTemplate' },
{ property: 'ativo', label: 'Status', type: 'cellTemplate' }
];
<po-table class="po-md-12" [p-columns]="colunas" [p-items]="pessoas" p-striped="true" [p-actions]="acoes"
p-loading="1" p-height="380"
p-loading-show-more="1"
(p-show-more)="carregarMais()">
<ng-template p-table-cell-template let-column="column" let-row="row">
<span *ngIf="column.property === 'cidade'">{{ row.endereco.cidade }}</span>
<span *ngIf="column.property === 'estado'">{{ row.endereco.estado }}</span>
<a href="" *ngIf="column.property === 'ativo'">{{ row.ativo === true? 'Ativo' : 'Inativo' }}</a>
</ng-template>
</po-table>
Como está o andamento dessa issue? Seria algo interessante que tenho interesse em tentar desenvolver
Esta em nosso backlog,
Visto a necessidade, vamos verificar a possibilidade de incluir nas próximas versões, mas seria uma colaboração muito importante caso puder faze-la.
Caso não puder vamos preparar para as proximas versões.
Esta em nosso backlog,
Visto a necessidade, vamos verificar a possibilidade de incluir nas próximas versões, mas seria uma colaboração muito importante caso puder faze-la.
Caso não puder vamos preparar para as proximas versões.
Ahh não devo conseguir mexer em breve nisso, então se vão priorizar blza :)