如何将 Angular js 与 asp.net 2017 MVC 核心集成？答案

【问题标题】：How to integrate angular js with asp.net 2017 MVC core?如何将 Angular js 与 asp.net 2017 MVC 核心集成？
【发布时间】：2018-09-04 16:11:54
【问题描述】：

我正在使用 Asp.net MVC Core (2017) 和 angular 开发一个简单的 Web 应用程序. 这是带有控制器的 head 部分的脚本代码：（注意：“脚本”文件夹位于 wwwroot 中，其中包含 angular.min.js）

<script src="~/Scripts/angular.min.js" type="text/javascript">
    var app = angular.module("moduleName", []).controller(function ($scope) {
        $scope.message = "hello world";

    });
</script>

这是正文部分的 div：

<div ng-app="moduleName">{{message}}</div>

在运行时抛出错误：

JavaScript runtime error: [$injector:modulerr] http://errors.angularjs.org/1.6.9/$injector/modulerr?p0=moduleName&p1=Error%3A%20%5B%24injector%3Anomod%

即使我尝试使用堆栈溢出问题中的解决方案： AngularJS 0x800a139e - JavaScript runtime error: [$injector:modulerr]。但是没有用。

这个错误的解决方法是什么？？？

【问题讨论】：

标签： javascript asp.net angularjs asp.net-mvc asp.net-core

【解决方案1】：

关闭angularjsscript标签

<script src="~/Scripts/angular.min.js" type="text/javascript"> </script>
<script>
    var app = angular.module("moduleName", []).controller(function ($scope) {
        $scope.message = "hello world";

    });
<script>

为控制器命名：

<script>
        var app = angular.module("moduleName", []);
        app.controller('firstCtrl',function ($scope) {
            $scope.message = "hello world";

        });
    <script>

HTML：

  <div ng-app="moduleName">
    <div ng-controller='firstCtrl'>.....
       {{message }}
    ...
   </div>
</div>

【讨论】：