在现有 MVC 5 应用程序中使用 Angular JS答案

【问题标题】：Using angular JS in existing MVC 5 application在现有 MVC 5 应用程序中使用 Angular JS
【发布时间】：2016-07-29 09:40:10
【问题描述】：

我们正在现有的 .net MVC 5 项目中开发一个新模块。我想使用 Angular 2 来开发它。

假设有一个控制器在屏幕上呈现视图；在那之后，该视图使用 Angular JS 工作。

我遇到了问题。我注意到在执行 npm install 之后，我看到 node_modules 和 typings 文件夹都被排除在项目之外，这在我刚刚创建 Angular 应用程序时不会发生，假设它必须做一些 Web 项目。其次，如果不给出实际的物理路径，我就无法导入模块“Angular2/core”是它找不到的模块。

应用程序也不能正常工作会报错

system.src.js:1154 GET http://sts.fb2/scripts/app/main404（未找到）fetchTextFromURL @system.src.js:1154（匿名函数）@system.src.js:1710ZoneAwarePromise @angular2-polyfills.js:589（匿名函数）@system.src.js:1709（匿名函数）@system.src.js:2734（匿名函数）@system.src.js:3308（匿名函数）@system.src.js:3575（匿名函数） @system.src.js:3960(匿名函数)@system.src.js:4419(匿名函数)@system.src.js:4671(匿名函数)@system.src.js:406ZoneDelegate.invoke@angular2-polyfills .js:332Zone.run @ angular2-polyfills.js:227(匿名函数) @ angular2-polyfills.js:576ZoneDelegate.invokeTask @ angular2-polyfills.js:365Zone.runTask @ angular2-polyfills.js:263drainMicroTaskQueue @ angular2-polyfills .js:482F@system-polyfills.src.js:1276H@system-polyfills.src.js:1276q.when@system-polyfills.src.js:1276T.run@system-polyfills.src.js:1276t._drain @system-polyfills.src.js:1276drain @system-polyfills.src.js:1276e @system-polyfi lls.src.js:1276 angular2-polyfills.js:332 Error: Error: XHR error (404 Not Found) loading http://sts.fb2/scripts/app/main(...)

请有人帮助我了解如何实现这一点？一个示例应用程序将非常有帮助

谢谢，斯内哈

【问题讨论】：

标签： asp.net-mvc-5 angular

【解决方案1】：

System.config({
    map: {
        app: '/scripts/App',
    },
    packages: {
        app: {
            format: 'cjs',
            defaultExtension: 'js'
        }
    }
});

一）在导入 main.js 之前添加此代码。您可以使用 SystemJs 配置，使用扩展映射包。

b) 也许您将 angular2.js 添加到您的 buddle 列表中，这将恢复 js 文件的顺序，也许这也会导致此问题。您可以检查您的 html 文件中的 ref 脚本。

也许你可以看到这个。link

【讨论】：

链接已损坏。