Angular 2 路由资源未找到

Question

我正在使用 VS 2015 RC，在 WebAPI 项目上工作，当我尝试在 Angular 2 中使用路由时，出现以下错误：

Failed to load resource: the server responded with a status of 404 (Not Found) localhost:14580/angular2/router

Potentially unhandled rejection [3] Error loading "angular2/router" at localhost:14580/angular2/router Error loading "angular2/router" from "Components/main/main" at localhost:14580/Components/main/main.js Not Found: localhost:14580/angular2/router (WARNING: non-Error used)

视图是 main.ts 组件的基本导入。组件代码如下：

/// <reference path="../../Scripts/typings/angular2/angular2.d.ts" />
/// <reference path="../../Scripts/typings/_custom/ng2.d.ts" />

import {Router, RouteConfig, RouterLink, RouterOutlet} from 'angular2/router';
import {Component, View, bootstrap} from 'angular2/angular2';
import {Login} from '../login/login';
import {status, json} from 'Scripts/utils/fetch'


// Annotation section
@Component({
    selector: 'my-app'
})
@View({
        templateUrl: 'Views/main/main.html',
        directives: [RouterLink, RouterOutlet]
})
@RouteConfig([
{ path: '/login', as: 'login', component: Login }
])
// Component controller
export class Main {
    //router: Router;
    name: string;
constructor(router: Router) {
    //this.router = router;
    this.name = 'Routing';

   router.config([{ path: '/login', as: 'login', component: Login }]);
}

login(event, email, password) {
    event.preventDefault();

    window.fetch('/api/Account/Login', {
        method: 'POST',
        headers: {
            'Accept': 'application/json',
            'Content-Type': 'application/json'
        },
        body: JSON.stringify({
            email, password
        })
    })
        .then(status)
        .then(json)
        .then((response) => {
    alert(response);
        //    this.router.parent.navigate('/home');
    })
        .catch((error) => {
        alert(error.message);
        console.log(error.message);
    });
}

}
bootstrap(
    Main
);

Answer 1

如果你为 Angular 2 引入最新的 definitelyTyped 类型，它可能更容易工作。这是一个工作示例：

http://www.syntaxsuccess.com/viewarticle/routing-in-angular-2.0

Answer 2

您需要像添加 angular2.dev.js 一样在 html 中添加 router.dev.js。所以只需将此行添加到您的 index.html 的头部：

<script src="../node_modules/angular2/bundles/router.dev.js"></script>

PS。我知道你已经解决了这个问题，但答案并不明确，我花了一段时间才意识到我的应用程序出了什么问题。

Angular 2 路由资源未找到

Angular 2 routing resource not found

c#

typescript

visual-studio-2015

angular