Question

我看到使用Angular 2在ASP.Net MVC中使用typescript导入时出现了一些非常奇怪的行为。运行时报告它的以下代码错误无法从根目录找到ng2-highcharts包 - 而不是node_modules。

所有其他导入工作 - 都是相对于node_modules识别的。

代码：

import {Component, View, OnInit} from 'angular2/core';
import {Ng2Highcharts} from "ng2-highcharts/ng2-highcharts";
import {CORE_DIRECTIVES, FORM_DIRECTIVES, NgClass} from 'angular2/common';
import EndPointService  from '../services/EndPointService';

//import {CHART_DIRECTIVES} from 'ng2-charts';

@Component({
    selector: 'index',
    providers: [EndPointService],
    templateUrl: '/Admin.Portal/App/views/view-admin-users.html',
    directives: [Ng2Highcharts]
})
export class IndexComponent ...

错误：加载http://localhost/Admin.Portal/ng2-highcharts/ng2-highcharts.js（...）

时出现XHR错误（404 Not Found）

运行@ angular2-polyfills.js：138

tsConfig：

{
  "compilerOptions": {
    "module": "system",
    "sourceMap": true,
    "noImplicitAny": true
  }
}

.csproj Typescript设置

<TypeScriptTarget>ES5</TypeScriptTarget>
    <TypeScriptJSXEmit>None</TypeScriptJSXEmit>
    <TypeScriptCompileOnSaveEnabled>True</TypeScriptCompileOnSaveEnabled>
    <TypeScriptNoImplicitAny>False</TypeScriptNoImplicitAny>
    <TypeScriptModuleKind>CommonJS</TypeScriptModuleKind>
    <TypeScriptRemoveComments>False</TypeScriptRemoveComments>
    <TypeScriptOutFile />
    <TypeScriptOutDir />
    <TypeScriptGeneratesDeclarations>False</TypeScriptGeneratesDeclarations>
    <TypeScriptNoEmitOnError>True</TypeScriptNoEmitOnError>
    <TypeScriptSourceMap>True</TypeScriptSourceMap>
    <TypeScriptMapRoot />
    <TypeScriptSourceRoot />
    <TypeScriptExperimentalDecorators>True</TypeScriptExperimentalDecorators>

我尝试导入相对路径，但tsc失败了。有人可以帮忙吗？

提前致谢。

Answer 1

您应该将此映射条目添加到SystemJS配置中。像这样：

<script>
  System.config({
    map: {
      'ng2-highcharts': 'node_modules/ng2-highcharts',
    },
    packages: {
      (...)
    }
  });
  (...)
</script>

ASP.NET MVC Angular 2无法加载资源：服务器响应状态为404（未找到）

1 个答案: