如何在Asp.net MVC Core 2017中集成AngularJS？代码运行问题求助

我看了你的代码，发现几个关键问题导致页面没正常显示"hello world"，下面给你一步步修正：

问题1：Script标签同时包含src和内部代码 #

当<script>标签设置了src属性时，浏览器会优先加载外部JS文件，完全忽略标签内部的代码。所以你写的Angular模块和控制器代码根本没执行。

问题2：Angular控制器定义不完整 #

你定义控制器时没指定控制器名称，而且页面的div也没绑定这个控制器，Angular不知道该用哪个控制器处理这个作用域。

修正后的头部脚本代码 #

把angular引用和自定义代码拆成两个独立的script标签，同时补全控制器的定义：

<script src="~/Scripts/angular.min.js" type="text/javascript"></script>
<script type="text/javascript">
    // 定义Angular模块
    var app = angular.module("moduleName", []);
    // 给模块添加控制器，指定控制器名称
    app.controller("myController", function ($scope) {
        $scope.message = "hello world";
    });
</script>

修正后的主体div代码 #

在div上添加ng-controller指令，绑定我们定义的控制器：

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

额外检查点 #

• 确认wwwroot/Scripts/angular.min.js文件确实存在，路径没有写错（ASP.NET Core里~/会映射到wwwroot目录，这个路径是对的）。
• 打开浏览器开发者工具（F12），切换到Console标签，看看有没有报错，比如Angular加载失败的提示，这能帮你快速定位问题。

这样修改后，页面应该就能正常显示"hello world"了！

内容的提问来源于stack exchange，提问作者Nikhil Patil