在cshtml文件

时间:2016-10-13 05:07:01

标签: angularjs asp.net-mvc razor angular

我正在尝试在cshtml文件中加载angular2模块。 我已经加载了一个html文件,所以我尝试将所有必要的脚本复制到cshtml文件,但由于无法加载/ app / main而无法正确加载

这是原始的html文件标记。

<!DOCTYPE html>
<html>

<head>
    <meta name="viewport" content="width=device-width" />
    <title></title>
    <script src="/node_modules/es6-shim/es6-shim.js"></script>
    <script src="/node_modules/angular2/bundles/angular2-polyfills.js"></script>
    <script src="/node_modules/systemjs/dist/system.src.js"></script>
    <script src="/node_modules/rxjs/bundles/Rx.js"></script>
    <script src="/node_modules/angular2/bundles/angular2.dev.js"></script>
    <script>

    System.config({
        packages: {
            'app': {
                defaultExtension: 'js'
            }
        },
    });
    System.import('/app/main').then(null, console.error.bind(console));
    </script>
</head>

<body>
    <div> </div>
</body>

</html>
<pm-app>
    <div>
        <p> Please wait ...</p>
    </div>
</pm-app>

它出现以下错误:

  

无法加载资源:服务器响应状态为404   (未找到)

我已经尝试使用带有以下代码的cshtml。

@{
    ViewBag.Title = "Index";
}
<script src="~/node_modules/es6-shim/es6-shim.js"></script>
<script src="~/node_modules/angular2/bundles/angular2-polyfills.js"></script>
<script src="~/node_modules/systemjs/dist/system.src.js"></script>
<script src="~/node_modules/rxjs/bundles/Rx.js"></script>
<script src="~/node_modules/angular2/bundles/angular2.dev.js"></script>
<script>

    System.config({
        packages: {
            'app': {
                defaultExtension: 'js'
            }
        },
    });
    System.import('/app/main').then(null, console.error.bind(console));
</script> 


<h2>Index </h2>

<pm-app>Loading App ...</pm-app>

这会出现相同的错误消息。我也试过了 1.将所有脚本放在布局页面的标题部分 2.将渲染部分放在布局页面中,并在index.cshtml文件中添加部分。

所有三次尝试都给了我相同的错误消息,所以我想知道这样做是否纯粹是一种不好的做法(在cshtml中加载角度模块)或者是否有任何修复。

感谢您的帮助。

干杯。

1 个答案:

答案 0 :(得分:0)

您只需关注此https://www.youtube.com/watch?v=WA4dPYlRwrE&spfreload=5 将您的库复制到_layout.cshtml