.NET 6中如何使用AngularJS？后端C#开发者求助

1. 正确获取并放置AngularJS文件 #

新版ASP.NET（包括Core）的NuGet包不会自动将前端库文件复制到项目静态资源目录（如wwwroot），你可以按以下方式处理：

• 找到NuGet包中的AngularJS文件：C:\Users\myuser\.nuget\packages\angularjs.core\1.8.2\content\Scripts下的angular.js（开发版）或angular.min.js（生产压缩版）
• 将文件复制到项目的wwwroot/js目录下，若无此目录直接新建即可

更推荐用LibMan（ASP.NET官方前端库管理工具）安装，步骤更简便：

• 右键项目 → 「添加」→ 「客户端库」
• 提供程序选cdnjs，搜索angularjs，选中1.8.2版本，目标位置设为wwwroot/js，点击「安装」，文件会自动部署到指定目录

2. 确保脚本引用路径正确 #

在_Layout.cshtml中，脚本引用要匹配文件实际路径：

<!-- 开发环境用未压缩版便于调试，生产环境替换为angular.min.js -->
<script src="~/js/angular.js"></script>

注意：ASP.NET Core中~/会映射到wwwroot目录，务必保证文件存放路径和引用路径一致。

3. 初始化AngularJS应用 #

AngularJS需要通过ng-app指令识别应用范围，否则{{}}表达式不会被解析，两种初始化方式可选：

• 全局初始化：在_Layout.cshtml的<html>标签上添加指令：

  <html ng-app>
  

• 局部初始化：在需要使用AngularJS的页面容器上添加指令，比如你的首页：

  @{
      ViewData["Title"] = "Home Page";
  }
  
  <div class="text-center" ng-app>
    {{90*90}}
  </div>
  

完成后页面加载时，AngularJS会自动解析表达式，显示计算结果8100。

额外提示：TypeScript迁移准备 #

如果后续要迁移到TypeScript，提前做好这些配置：

• 右键项目 → 「添加」→ 「新建项」→ 选择「TypeScript文件」，项目会自动生成tsconfig.json等必要配置文件
• 安装@types/angular NuGet包，获取AngularJS的TS类型定义，提升开发时的智能提示体验

内容的提问来源于stack exchange，提问作者Guilherme Augusto De Sousa