AngularJS无法显示Spring Boot返回数据的问题排查及教程推荐

我仔细梳理了你的代码，发现几个关键问题导致数据无法正常显示，下面逐一拆解并给出修复方案：

1. 后端返回数据与前端接收不匹配 #

你的Spring Boot接口/allusers直接返回的是List<UserDtlsVO>（JSON数组格式，比如[{"user_name":"张三",...},...]），但前端AngularJS代码里错误地假设返回数据外层有users字段：

$scope.user = response.data.users;

修复方案：将这行代码修改为直接接收数组：

$scope.users = response.data; // 把后端返回的数组直接赋值给$scope.users

2. AngularJS循环指令使用错误 #

你的HTML中的ng-repeat存在两处问题：

• 遍历的变量articles未定义，应该用刚才赋值的users数组
• 循环内部错误引用全局的user，应该使用当前循环项

修复方案：修改循环代码为：

<div data-ng-repeat="userItem in users">
  {{userItem.user_name}} {{userItem.user_password}}
</div>

3. 额外调试建议 #

• 先在浏览器直接访问http://localhost:7000/allusers，确认返回的JSON结构是否符合预期（是数组且包含user_name、user_password字段）
• 在AngularJS的$http成功回调里添加console.log(response.data)，查看控制台打印的数据，确认前端是否正确接收
• 检查app.js的路径是否正确：<script src ="../../JS/app.js"></script>，如果HTML文件位置变动，相对路径可能失效导致控制器未加载

4. 潜在跨域问题（若后续出现） #

如果前端页面是本地直接打开的file://协议，后端在localhost:7000，可能触发跨域限制。可以在Spring Boot控制器添加跨域注解解决：

@RestController
@EnableAutoConfiguration
@RequestMapping("/")
@CrossOrigin(origins = "*") // 生产环境建议限制具体域名
public class UserController {
    // ... 现有代码
}

优质免费AngularJS学习资源推荐 #

• AngularJS官方文档：最权威的学习资料，包含入门指南、API参考和实战示例，适合系统性学习
• 菜鸟教程AngularJS板块：中文入门教程，步骤清晰，新手友好，快速上手基础语法
• FreeCodeCamp AngularJS课程：交互式学习平台，通过实战项目巩固知识点
• 《AngularJS权威指南》免费电子版：可找到合法开源分享版本，内容全面，适合深入进阶

内容的提问来源于stack exchange，提问作者Parth Doshi