Pessoal, boa tarde.
Poderiam me dar um apoio 'básico'.
Estou iniciando no Angular 17 e por conta das variações de versões, muitas documentações do proprio PO-UI não informam como está o processo de Router na nova versão do angular, com o app.routes, por exemplo.
Teriam um exemplo prático de redirecionamento de Pagina com o Menu Item usando o POMENUITEM na versão 17/18? Sem o app.routing.module.
E caso tenham algum outro exemplo para me aprofundar nos estudos, eu agradeceria.
Att
Fala Rafael, tudo bem? Segue exemplo espero que ajude.
//app.component.html
import { CommonModule } from '@angular/common';
import { HttpClientModule } from '@angular/common/http';
import { Component } from '@angular/core';
import { Router, RouterOutlet } from '@angular/router';
import {
PoComponentsModule,
PoMenuItem,
PoMenuModule,
PoModule,
PoPageModule,
PoToolbarModule,
} from '@po-ui/ng-components';
import { PoTemplatesModule } from '@po-ui/ng-templates';
import { ProspectListComponent } from './feature/prospect-list/prospect-list.component';
@Component({
selector: 'app-root',
standalone: true,
imports: [
CommonModule,
RouterOutlet,
PoToolbarModule,
PoMenuModule,
PoPageModule,
HttpClientModule,
PoModule,
PoTemplatesModule,
PoComponentsModule,
ProspectListComponent,
],
templateUrl: './app.component.html',
styleUrls: ['./app.component.css'],
})
export class AppComponent {
constructor(private router: Router) {}
readonly menus: Array<PoMenuItem> = [
{
label: 'Home',
action: this.onClick.bind(this),
icon: 'po-icon po-icon-money',
shortLabel: 'Home',
},
{
label: 'Prospect',
action: () => this.router.navigate(['/prospect']),
icon: 'po-icon po-icon-money',
shortLabel: 'Prospect',
},
];
private onClick() {
alert('Clicked in menu item');
}
}//app.routes.ts
import { Routes } from '@angular/router';
import { ProspectListComponent } from './feature/prospect-list/prospect-list.component';
export const routes: Routes = [
{ path: 'prospect', component: ProspectListComponent },
];//app.component.ts
export class AppComponent {
constructor(private router: Router) {}
readonly menus: Array<PoMenuItem> = [
{
label: 'Home',
action: this.onClick.bind(this),
icon: 'po-icon po-icon-money',
shortLabel: 'Home',
},
{
label: 'Prospect',
action: () => this.router.navigate(['/prospect']),
icon: 'po-icon po-icon-money',
shortLabel: 'Prospect',
},
];
private onClick() {
alert('Clicked in menu item');
}
}Leandro, muito obrigado !
Já é um começo.
que bom, marca ai como resposta
— Leandro Lemos 18 de Jul de 2024