2

Hola alguno que tenga idea de como hacer esto. Tengo una aplicación resulta que no e podido hacer que la url sea limpia

Por ejemplo:

midominio.com/propiedad/1/esto-es-una-url/categoria/madre-en-apuro

pero actualmente esta así:

midominio.com/#/propiedad/1/esto-es-una-url/categoria/madre-en-apuro

En mi app.routing.module.ts tengo lo siguiente:

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { RouterModule, Routes } from '@angular/router';
import { AuthGuard } from './auth.guard';

import { HomeComponent } from './pages/home/home.component';
import { PropDetailPageComponent } from './pages/prop/prop-detail-page/prop-detail-page.component';
import { PrivacidadPageComponent } from './pages/privacidad-page/privacidad-page.component';
import { TermsyCondPageComponent } from './pages/termsy-cond-page/termsy-cond-page.component';
import { NotFoundComponent } from './pages/not-found/not-found.component';
import { NuevaPropComponent } from './pages/prop/nueva-prop/nueva-prop.component';
import { SignInComponent } from './pages/sign-in/sign-in.component';
import { NuevaPropOkComponent } from './pages/prop/nueva-prop-ok/nueva-prop-ok.component';
import { MiCuentaComponent } from './pages/mi-cuenta/mi-cuenta.component';
import { SearchComponent } from './pages/search/search.component';
import { PublicProfileComponent } from './pages/public-profile/public-profile.component';
import { SelectPrecioComponent } from './pages/select-precio/select-precio.component';
import { SelectPlanComponent } from './pages/select-plan/select-plan.component';
import { EditarPropComponent } from './pages/prop/editar-prop/editar-prop.component';

import { MercadoPagoOkComponent } from './pages/MP/mercado-pago-ok/mercado-pago-ok.component';
import { MercadoPagoFailComponent } from './pages/MP/mercado-pago-fail/mercado-pago-fail.component';
import { MercadoPagoPendComponent } from './pages/MP/mercado-pago-pend/mercado-pago-pend.component';
import { VerificationComponent } from './pages/verification/verification.component';

const routes: Routes = [
  { path: '', component: HomeComponent },
  { path: 'home/:id', component: HomeComponent },
  { path: 'propiedad/:tipo_prop_nombre/:nombre_operacion/:provincia/:ciudad/:id/:titulo', component: PropDetailPageComponent },
  { path: 'propiedad/edit/:id', component: EditarPropComponent, canActivate: [AuthGuard] },
  { path: 'privacidad', component: PrivacidadPageComponent },
  { path: 'terminos', component: TermsyCondPageComponent },
  { path: "404", component: NotFoundComponent },
  { path: "signin", component: SignInComponent },
  { path: "new-prop", component: NuevaPropComponent, canActivate: [AuthGuard] },
  { path: "new-prop-ok", component: NuevaPropOkComponent, canActivate: [AuthGuard] },
  { path: "mi-cuenta", component: MiCuentaComponent, canActivate: [AuthGuard] },
  { path: "search", component: SearchComponent },
  { path: 'perfil/:id', component: PublicProfileComponent },
  { path: 'select-plan', component: SelectPrecioComponent },
  { path: 'update-plan', component: SelectPrecioComponent },
  { path: 'compraOk', component: MercadoPagoOkComponent },
  { path: 'compraFail', component: MercadoPagoFailComponent },
  { path: 'compraPending', component: MercadoPagoPendComponent },
  { path: 'verify/:id', component: VerificationComponent },
  { path: "**", redirectTo: "/404" },

];

@NgModule({
  imports: [RouterModule.forRoot(routes, { useHash: true })],
  exports: [RouterModule]
})

export class AppRoutingModule { }

1 respuesta 1

2

El símbolo # en inglés se llama hash. Sabiendo esto es fácil deducir que basta con el siguiente cambio:

@NgModule({
  imports: [RouterModule.forRoot(routes, { useHash: false })],
  exports: [RouterModule]
})
4
  • No hay ninguna complicación extra en hacer esto?
    – Legna
    el 13 feb. 2019 a las 22:36
  • No me funciona a pesar que hice lo que me pides
    – vdjkelly
    el 14 feb. 2019 a las 1:50
  • 1
    @vdjkelly había probado esta solución mucho antes de que actualizara mis proyectos a la version 7.2.2 de Angular y por ende al ver tu pregunta (respuesta) me dio por probar de nuevo y ahora tengo mis direcciones de forma correcta. Por eso la marco, deberías de probar si esto ayuda.
    – jecorrales
    el 16 feb. 2019 a las 23:53
  • Lo que me lleva a realizar una pequeña pregunta técnica del ¿por qué se utiliza este "hash" dentro de las rutas?
    – jecorrales
    el 17 feb. 2019 a las 0:02

Tu Respuesta

Al pulsar en “Publica tu respuesta”, muestras tu consentimiento a nuestros términos de servicio, política de privacidad y política de cookies

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.