Маршруты Angular 6 не работают с модулем "Маршрутизатор", я думаю, что у меня есть ошибка, но я не знаю, что это такое - PullRequest
0 голосов
/ 23 сентября 2018

У меня установлены маршруты, и у меня есть 2 выхода, основной и второй, называемые «Sesion», однако я установил несколько маршрутов для «Sesion» Outlet, он только позволяет мне перейти к первому, то есть когда янажмите кнопку «Ingresar» (вы увидите это позже), это приведет меня эффективно к установленному маршруту, и я меняю компонент, но когда я пытаюсь изменить содержимое розетки с помощью другой кнопки в текущем компоненте, он не работаетбольше ... или вернуться к визуализации предыдущего компонента, ни перейти к другому.

Это мои маршруты ():

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { AccionesComponent } from './acciones/acciones.component';
import { SesionComponent } from './sesion/sesion.component';
import { PostulacionComponent } from './postulacion/postulacion.component'
import { VotacionComponent } from './votacion/votacion.component';

const routes: Routes = [
  {
    path: "",
    component: AccionesComponent 
  },
  {
    path: "votacion",
    component: VotacionComponent 
  },
  {
    path: "",
    component: SesionComponent,
    outlet: "sesion"
  },
  {
    path: "siguiente",
    component: PostulacionComponent,
    outlet: "sesion"
  },
  {
    path: "votacion",
    component: VotacionComponent,
    outlet: "sesion"
  }
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }

My app.HTML (компонент по умолчанию)

<div class="clearfix col contenedor">  
  <div class="column acciones">
        <router-outlet></router-outlet>
    </div>

    <div class="column sesion"> 
        <router-outlet name="sesion"></router-outlet>
    </div>
</div>

My Sesion.component.html: (эта кнопка работает как «ingresar»)

<div class="content1">
    <div class="content2">

      <div class="row">
        <h1 class="tit"><b>Inicio de Sesión</b></h1>
      </div>
      <div class="row">
        <input class="inputs" type="text" name="nombre" value="Usuario o código de empleado">
        <br>
      </div>
      <div class="row">
        <input class="inputs" type="text" name="pass" value="Contraseña">
        <br><br>
      </div>
      <div class="row">
        <input type="button" value="Ingresar" [routerLink]="[{ outlets: {sesion: ['siguiente'] } }]" routerLinkActive="active">
      </div>
      <div class="row">
        <a class="tit2"><b>¿Olvidáste tu contraseña?</b></a>
      </div>  

    </div>
</div>

My acciones.component.html (содержимое первичной сети)

<div class="tittle">#YoValoroOL</div>
<div class="text"><p>Apoya a tus colegas para que reciban el reconocimiento 
  que se merecen en el marco de los valores que nos definen como empresa.</p>
</div>
<div class= "tittle2">OLSoftware</div>

My postulation.component.html () (Эта кнопка не работает "Вотар")

<div class="content1">
    <div class="content2">
        <h1 class="tit"><b>Postulaciones</b></h1>
      <div class="label row">
         Buscar por nombre:
      </div>
          <select class="inputs" name="nombrea">
              <option value="volvo">Vanessa Velez Portera</option>
              <option value="saab">Vanesa Velez</option>
              <option value="fiat">Stiven Duran</option>
              <option value="audi">Camila de la Espriella</option>
          </select>
      <br><br><br><br>
      <div class="label row">
          Buscar por rol:
       </div>
          <select class="inputs" name="passa">
              <option value="volvo">Desarrollador Front-End</option>
              <option value="saab">Vanesa Velez</option>
              <option value="fiat">Stiven Duran</option>
              <option value="audi">Camila de la Espriella</option>
          </select>
      <div class="content3">
        <a [routerLink]="[{outlets:{sesion: ['votacion'] } }]"
         routerLinkActive="active">Votar</a>
      </div>
      <div class="row">
        <input type="button" value="Seleccionar">
      </div>
    </div>
</div>

Мой votacion.component.html: это просто определениеault component

<p>
  votacion works!
</p>

, пожалуйста, помогите мне, я не знаю причину не работать

Это ошибка:

Ошибка: Uncaught (в обещании): Ошибка: невозможно сопоставить ни один маршрут.Сегмент URL: 'siguiente'

https://github.com/marco7247/APPDinam.git это код, если кто-то может мне помочь, пожалуйста.

ДАЖЕ, ЕСЛИ Я ИЗМЕНИЛ ЗАКАЗ НА МАРШРУТЫ, ТОЛЬКО РАБОТАЮТ ПЕРВЫМВРЕМЯ С ПЕРВЫМ ИЗМЕНЕНИЕМ.

Ответы [ 2 ]

0 голосов
/ 24 сентября 2018

Я обнаружил проблему ... Angular представляет ошибки, если вы не используете основную розетку, я создал две новые розетки, и я не использовал первичную, поэтому ... спасибо за попытку помочь мне.

0 голосов
/ 23 сентября 2018

Ошибка "... Uncaught (в обещании): ..." происходит, потому что основной маршрут не может обработать маршрут 'siguiente'.

Чтобы исправить ошибку маршрутаВы можете добавить первичный перехват всех маршрутов:

{
    path: '**',
    component: AnotherComponent
}

или первичный именованный маршрут:

{
    path: 'siguiente',
    component: AnotherComponent
}

Вторичные маршруты не доступны через их имя так же, как и первичные маршруты.Ссылка для доступа к вторичному маршруту будет выглядеть следующим образом: http://localhost:4200/(sesion:siguiente).

при доступе к http://localhost:4200/siguiente, вы попадете на основной маршрут, а дополнительный маршрут будет разрешен как '', поэтомувы получаете содержимое SesionComponent во вторичном маршруте-выходе.

Возможно, вы захотите посетить угловые документы , чтобы также узнать о нем больше.

Обновление

также, ссылка должна быть исправлена, это правильный код для навигации по дополнительному маршруту:

<a [routerLink]="[{ outlets: { sesion: ['votacion'] } }]"
   routerLinkActive="active">Votar</a>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...