страница отображается дважды в браузере, используя angular роутер? - PullRequest
Новая
       8

страница отображается дважды в браузере, используя angular роутер?

0 голосов
/ 09 апреля 2020

Angular загружал страницу через порт по умолчанию localhost:4200 Я хотел, чтобы она работала как localhost:4200/specialtyquestions, когда сборка приложения работает, но он показывает страницы дважды в браузере. Есть идеи, что здесь реализовано неправильно?

app-routing.module.ts 

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { AppComponent } from './app.component';


const routes: Routes = [{
  path: 'specialtyquestions',
  component: AppComponent
},
{
  path: '',
  redirectTo: 'specialtyquestions',
  pathMatch: 'full'
}];


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

app.component. html

<app-navbar></app-navbar>
<div class="container-fluid">
    <div class="row">
        <div class="col-sm-5">
            <app-create-questions></app-create-questions>
        </div>
        <div class="col-sm-1">
            <div class="row">
                <button type="button" class="btn btn-primary" data-backdrop='static' (click)="openModal()" style="margin-top: 300px;" data-toggle="modal" data-target="#exampleModalLong">Start Formatting</button>
            </div>
        </div>
        <div class="col-sm-5">
            <app-format-questions></app-format-questions>
        </div>
    </div>
</div>
<h2>
    <router-outlet></router-outlet>
</h2>

image

enter image description here

1 Ответ

0 голосов
/ 09 апреля 2020

Удалите Router-Outlet, потому что когда вы добавляете этот тег в последний раз, запустите эту часть еще раз. поэтому удалите эту часть с конца и проверьте 

<app-navbar></app-navbar>
<div class="container-fluid">
    <div class="row">
        <div class="col-sm-5">
            <app-create-questions></app-create-questions>
        </div>
        <div class="col-sm-1">
            <div class="row">
                <button type="button" class="btn btn-primary" data-backdrop='static' (click)="openModal()" style="margin-top: 300px;" data-toggle="modal" data-target="#exampleModalLong">Start Formatting</button>
            </div>
        </div>
        <div class="col-sm-5">
            <app-format-questions></app-format-questions>
        </div>
    </div>
</div>

Часть маршрутизатора необходима, если вы хотите выполнить маршрутизацию с одной страницы на другую, например 127.0.0.1:4000/Student

...