Angular2与Mvc 4项目路线错误

时间:2016-06-15 23:37:31

标签: angularjs asp.net-mvc asp.net-mvc-4 typescript angular

这是我的Mvc 4 Project angular 2结构

   Solution 'Angular2Starter'
|-- angular2Starter
|   `-- Controllers
|       `-- HomeController.cs
|-- src
|   |-- app
|   |   |-- home
|   |   |   |-- home.component.ts
|   |   |   |-- home.css
|   |   |   |-- home.html
|   |   |-- app.component.spec.ts
|   |   |-- app.component.ts
|   |   |-- app.html
|   |   |-- app.routes.ts
|   |   `-- main.ts
|   |-- systemjs.conf.js
|   `-- tmp
|-- tasks
|-- gulp.config.js
|-- gulpfile.js
|-- package.json
|-- tsconfig.json
|-- tslint.json
|-- typings.json
|-- Web.config
`-- Views
    `-- Shared
        `-- _Layout.cshtml

这是我的Layout.cshtml

<html>
  <head>
    <title>Angular 2 QuickStart</title>
    <base href="/">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <!-- build:css assets/bundle.css -->
    <link rel="stylesheet" href="~/node_modules/font-awesome/css/font-awesome.css">
    <!-- app:css -->
    <link rel="stylesheet" href="~/src/assets/styles/main.css">
    <!-- endinject -->
    <!-- endbuild -->
  </head>
  <body>@RenderBody()
    <as-main-app>
      <i class="center-fix main-spinner fa fa-spin fa-spinner"></i>
    </as-main-app>

    <!-- build:js assets/lib.js -->
    <script src="~/node_modules/jquery/dist/jquery.js"></script>
    <script src="~/node_modules/bootstrap-sass/assets/javascripts/bootstrap.js"></script>

    <!-- 1. Load libraries -->
    <script src="~/node_modules/zone.js/dist/zone.js"></script>
    <script src="~/node_modules/reflect-metadata/Reflect.js"></script>

    <!-- Polyfill(s) for older browsers -->
    <script src="~/node_modules/es6-shim/es6-shim.min.js"></script>
    <!-- endbuild -->

    <!-- build:js assets/app.js -->
    <script src="~/src/tmp/app/bundle.js"></script>
    <!-- endbuild -->

    <!-- build:remove -->
    <script src="~/node_modules/systemjs/dist/system.js"></script>
    <script src="~/src/systemjs.conf.js"></script>
    <script>
      System.import('app/main.js')
        .catch(function(err) { console.error(err); });
    </script>
    <!-- endbuild -->
  </body>
</html>

在我成功吞下并打开项目索引页面后,控制台给我错误

GET http://localhost:52994/app/app.html 404 (Not Found)
EXCEPTION: Failed to load app/app.html

我可能把整件事情弄错了,但找不到任何有关我情况的例子。我不知道这里发生了什么?有人可以帮忙吗?

1 个答案:

答案 0 :(得分:0)

  

System.import(&#39; app&#39;)。then(null,console.error.bind(console));

而不是

  

System.import(&#39;应用程序/ main.js&#39;)           .catch(function(err){console.error(err);});