Я новичок в AngularJS и хочу создать простую форму входа и регистрации, но мои маршруты не работают.
Это мой app.routing.ts:
import { Routes, RouterModule } from '@angular/router';
import { HomeComponent } from './home/home.component';
import { RegistrationComponent } from './registration/registration.component';
const appRoutes: Routes = [
{ path: '', component: HomeComponent },
{ path: 'register', component: RegistrationComponent },
];
export const routing = RouterModule.forRoot(appRoutes);
Это app.module.ts:
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import { HomeComponent } from './home/home.component';
import { RegistrationComponent } from './registration/registration.component';
import { routing } from './app.routing';
@NgModule({
imports: [
BrowserModule,
routing
],
declarations: [
AppComponent,
HomeComponent,
RegistrationComponent
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
Это app.component.html:
<router-outlet></router-outlet>
Я не понимаю, почему, когда я запускаю сервер, страница по умолчанию пуста, вместо того, чтобы показывать html, содержащийся в home.component.html.
Как я могу решить?
Мой app.component.html содержит в точности только тег, написанный выше.





Порядок маршрутов очень важен, поскольку они оцениваются в том порядке, в котором они определены. По сути, в вашем примере Angular проверяет пустой маршрут '', и если такой маршрут найден, то должен быть загружен HomeComponent, и то, что вы видите, должно быть home.component.html. Самый простой способ проверить это - добавить контент в home.component.html.
Если вам нужно показать RegistrationComponent на пустом маршруте, я предлагаю изменить определение маршрута для пустого маршрута '' из:
{ path: '', component: HomeComponent },
{ path: 'register', component: RegistrationComponent }
к
{ path: 'register', component: RegistrationComponent },
{ path: '', redirectTo: 'register', pathMatch: 'full' }
Таким образом, Angular сначала проверит, соответствует ли URL-адрес маршруту register. В противном случае он проверит, является ли это маршрутом ''. В этом случае маршрутизатор переключится на маршрут register, который загрузит RegistrationComponent.
Надеюсь это поможет.
Что я хочу сделать, так это загрузить, в случае пустого пути, html, содержащийся в home.component.html. Но это не работает, и я не понимаю, почему.
Вы изменили определения маршрута на то, что я предложил?
Да, но не работает. Поскольку я импортировал модули маршрута и изменил файл app.component.html, я ничего не вижу на домашней странице и на других страницах.
Я создал демонстрация. Пожалуйста, проверьте это.
Рад слышать. Пожалуйста, примите мой ответ как решение, если вы не против.
Можете ли вы опубликовать свой код AppComponent.html