Question

你好我是angular2的新手，学习，试图建立路线。

app.routing.ts

    import {FormApp} from  './app.form';
    import {Routes, RouterModule} from '@angular/router';

    const appRoutes = [
        {path:'form',component:FormApp},
        {path:'all',pathMatch:'full',redirectTo:'all'}
    ];

    export const routing = RouterModule.forRoot(appRoutes);
**app.module.ts**


      import {NgModule} from "@angular/core";
        import {BrowserModule} from "@angular/platform-browser";
        import {AppComponent} from "./app.component";
        import {AppMedia} from './app.media';
        import {FavoriteDirective} from './app.fav.directive';
        import { CustomPipe} from './app.pipe';
        import {ReactiveFormsModule} from '@angular/forms';
        import {FormApp} from './app.form';
        import {Service} from './app.service';
        import {varijablaTok, varijabla} from './app.tok';
        import {routing} from'./app.routing';

        const data = {velicina:['M','S','XXL']};

        @NgModule({
            imports:[BrowserModule, ReactiveFormsModule,routing],
            declarations:[ AppComponent, AppMedia, FavoriteDirective, CustomPipe, FormApp],
            bootstrap:[ AppComponent],
            providers:[Service,{
                provide: 'varijablaTok' ,useValue :varijabla
            }]



        })



export class AppModule  {}

和html文件

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<p id="par">Bozic je sevaju prangije i cesnicu baka sprema</p>
<media-app  [ngClass]="{'crveno ' : n.name === 'Firebug','plavo' : n.name ==='The Redemption' }" *ngFor="let n of xxx" (delete)="naDeletu(mediaItem)" [mediaItem]="n"></media-app>
<select>
    <option *ngFor="let d of varijabla.velicina">{{d}}</option>
</select>
<router-outlet></router-outlet>
</body>
</html>

我正在尝试使用router-outlet标签来路由formApp组件，但我有错误无法获得/traceur。我做错了什么我是angular2帮助的新手。 tnx i advance

Answer 1

在index.html文件中，您需要拥有app-component的选择器，因为这是您的应用程序根目录。然后在您的应用程序组件的模板中，您可以放置一个router-outlet元素。

我猜你的FormApp组件就是你想要进入路由器插座的。

您的index.html文件：

<body>
     <app-root></app-root>
</body

您的AppComponent模板：

    <p id="par">Bozic je sevaju prangije i cesnicu baka sprema</p>
<media-app  [ngClass]="{'crveno ' : n.name === 'Firebug','plavo' : n.name ==='The Redemption' }" *ngFor="let n of xxx" (delete)="naDeletu(mediaItem)" [mediaItem]="n"></media-app>
<select>
    <option *ngFor="let d of varijabla.velicina">{{d}}</option>
</select>
<router-outlet></router-outlet>

Angular2 404 GET / traceur

1 个答案: