执行时ng-repeat脚本被注释,AngularJS路由模板与控制器求助
问题原因与解决方案
你遇到的核心问题是**$scope.myArray被赋值成了JSON字符串,而非实际的JavaScript数组对象**,这直接导致ng-repeat无法识别并遍历数据,最终出现指令被注释、无法渲染的情况。
具体问题分析
在你的控制器代码里,这段赋值是关键错误:
$scope.myArray = "[{\"company_id\":\"1\",\"com_name\":\"jcb\",\"val_equ_id\":\"1\",\"created_on\":\"2018-03-24 13:00:43\"},{\"company_id\":\"2\",\"com_name\":\"komatsu\",\"val_equ_id\":\"1\",\"created_on\":\"2018-03-24 13:00:43\"}] ";
你给myArray赋了一个带引号的字符串,而ng-repeat只能遍历原生的JavaScript数组或对象,完全无法处理字符串类型的数据。
两种修复方案
方案1:直接使用数组字面量赋值(推荐,适用于静态数据)
去掉包裹数组的引号,直接把内容写成原生JS数组:
routingApp.controller('Controller-Param', function($scope, $routeParams, $http) { var aid = $routeParams.id; $scope.myArray = [ {"company_id":"1","com_name":"jcb","val_equ_id":"1","created_on":"2018-03-24 13:00:43"}, {"company_id":"2","com_name":"komatsu","val_equ_id":"1","created_on":"2018-03-24 13:00:43"} ]; });
方案2:将JSON字符串解析为数组(适用于动态获取的字符串数据)
如果这个JSON字符串是通过接口请求(比如$http)获取的,需要用JSON.parse()将其转换为数组:
routingApp.controller('Controller-Param', function($scope, $routeParams, $http) { var aid = $routeParams.id; // 假设这是从后端获取的字符串数据 var jsonStr = "[{\"company_id\":\"1\",\"com_name\":\"jcb\",\"val_equ_id\":\"1\",\"created_on\":\"2018-03-24 13:00:43\"},{\"company_id\":\"2\",\"com_name\":\"komatsu\",\"val_equ_id\":\"1\",\"created_on\":\"2018-03-24 13:00:43\"}] "; $scope.myArray = JSON.parse(jsonStr); });
注意:如果是用
$http请求后端接口,默认会自动将JSON格式的响应转换为JS对象/数组,不需要手动调用JSON.parse(),除非后端明确返回的是text/plain类型的响应。
验证修复效果
修改后,你的模板代码:
<ul > <li ng-repeat="obj in myArray">{{obj.com_name}}</li> </ul>
就能正常遍历myArray中的每个对象,渲染出jcb和komatsu两个列表项了。
内容的提问来源于stack exchange,提问作者vallapureddy Karunakar Reddy
相关产品推荐
相关产品推荐

