0

这是我的控制器：

'use strict';

/* Controllers */

function roles($scope, $http) {
    delete $http.defaults.headers.common['X-Requested-With']
  $http.get('/engine/ListRoles').success(function(data) {
    $scope.roles = data;
  });

  $scope.orderProp = 'id';
}

这是我得到的 JSON 响应/engine/ListRoles/

data: "[{"External":false,"Filter":"","ID":25,"Name":"content editor","Permissions":[{"Description":"test","Group":"report","ID":2,"Name":"view"},{"Description":"test","Group":"report","ID":4,"Name":"delete"},{"Description":"test","Group":"report","ID":3,"Name":"edit"},{"Description":"test","Group":"report","ID":5,"Name":"customize"},{"Description":"test","Group":"manage","ID":1,"Name":"access"}]},{"External":false,"Filter":"","ID":26,"Name":"data editor","Permissions":[{"Description":"test","Group":"manage","ID":1,"Name":"access"},{"Description":"test","Group":"manage","ID":6,"Name":"cache"},{"Description":"test","Group":"report","ID":5,"Name":"customize"},{"Description":"test","Group":"report","ID":4,"Name":"delete"},{"Description":"test","Group":"report","ID":3,"Name":"edit"},{"Description":"test","Group":"report","ID":2,"Name":"view"}]},{"External":false,"Filter":"","ID":27,"Name":"guest","Permissions":[]},{"External":false,"Filter":"","ID":2,"Name":"super user","Permissions":[{"Description":"test","Group":"manage","ID":1,"Name":"access"},{"Description":"test","Group":"report","ID":2,"Name":"view"},{"Description":"test","Group":"report","ID":3,"Name":"edit"},{"Description":"test","Group":"report","ID":4,"Name":"delete"},{"Description":"test","Group":"manage","ID":6,"Name":"cache"},{"Description":"test","Group":"report","ID":5,"Name":"customize"}]},{"External":false,"Filter":"","ID":1,"Name":"user","Permissions":[{"Description":"test","Group":"report","ID":2,"Name":"view"},{"Description":"test","Group":"report","ID":5,"Name":"customize"}]}]"
resultcode: "200"
resulttext: ""
timestamp: "/Date(1369497355200+0300)/"

但是，当我尝试使用这个 ng-repeat 时：

<div id="table" ng-controller="roles">
      <div>
            <div ng-repeat="role in roles.data">
               {{role.Name}}<br />
            </div>
      </div>
</div>

我只是得到一个巨大的空白 DIV 列表。

4

2 回答 2

1

如果您给出的响应实际上是从您的服务器返回的，那么这不是有效的 JSON 代码。您可以在此处查看规范：http ://www.ietf.org/rfc/rfc4627.txt 。

它指出 JSON 是一个序列化的对象或数组。因此，您返回的数据必须是对象或数组。此外，属性必须用双引号括起来。这与 JavaScript 不同，在 JavaScript 中，属性名称也可以在不将它们包装成双引号的情况下定义。返回以下内容，它将起作用：

{
"data": [{"External":false,"Filter":"","ID":25,"Name":"content editor","Permissions":[{"Description":"test","Group":"report","ID":2,"Name":"view"},{"Description":"test","Group":"report","ID":4,"Name":"delete"},{"Description":"test","Group":"report","ID":3,"Name":"edit"},{"Description":"test","Group":"report","ID":5,"Name":"customize"},{"Description":"test","Group":"manage","ID":1,"Name":"access"}]},{"External":false,"Filter":"","ID":26,"Name":"data editor","Permissions":[{"Description":"test","Group":"manage","ID":1,"Name":"access"},{"Description":"test","Group":"manage","ID":6,"Name":"cache"},{"Description":"test","Group":"report","ID":5,"Name":"customize"},{"Description":"test","Group":"report","ID":4,"Name":"delete"},{"Description":"test","Group":"report","ID":3,"Name":"edit"},{"Description":"test","Group":"report","ID":2,"Name":"view"}]},{"External":false,"Filter":"","ID":27,"Name":"guest","Permissions":[]},{"External":false,"Filter":"","ID":2,"Name":"super user","Permissions":[{"Description":"test","Group":"manage","ID":1,"Name":"access"},{"Description":"test","Group":"report","ID":2,"Name":"view"},{"Description":"test","Group":"report","ID":3,"Name":"edit"},{"Description":"test","Group":"report","ID":4,"Name":"delete"},{"Description":"test","Group":"manage","ID":6,"Name":"cache"},{"Description":"test","Group":"report","ID":5,"Name":"customize"}]},{"External":false,"Filter":"","ID":1,"Name":"user","Permissions":[{"Description":"test","Group":"report","ID":2,"Name":"view"},{"Description":"test","Group":"report","ID":5,"Name":"customize"}]}],
"resultcode": "200",
"resulttext": "",
"timestamp": "/Date(1369497355200+0300)/"
}

你得到一堆 div 的原因是你的 ng-repeat 指令实际上迭代了字符串的字符。你得到一个字符串是因为 AngularJS 没有将响应转换为对象，因为 JSON 不是有效的 JSON。

要检查您是否有有效的 JSON，您可以在 JavaScript 控制台（例如 Firebug）中使用 JSON.parse() 对其进行解析。

于 2013-05-25T16:38:27.130 回答
0

http://jsfiddle.net/uZWQY/37/ 有 2 种日期格式的角度指令示例。一种是日期格式化器，另一种是处理格式化为Microsoft Json Date的$scope元素：/Date(1369980188993)/

'Epoch' 中的日期格式现在已在 Micorost .Net 4.5 MVC JavascriptSerializer中修复。包括TheHansleMan在内的许多人感受到的痛苦现在通过以下方式减轻：Henrik 博客http://blogs.msdn.com/b/henrikn/archive/2012/02/18/using-json上的如何将序列化程序换成 JSON.NET -net-with-asp-net-web-api.aspx

角度解决方案（没有“作弊”并将日期重新格式化为服务器上的字符串）：

HTML

<input type="text" size="35" ng-model="testTime" jsondate='dd/MM/yyyy'>

Javascript：myApp.directive('jsondate', function (dateFilter) { return { require:'ngModel', link:function (scope, elm, attrs, ctrl) { var dateFormat = 'dd/MM/yyyy'; ctrl.$formatters.unshift(function (modelValue) { var newDate = new Date(parseInt(modelValue.replace("/Date(", "").replace(")/", ""), 10)); ctrl.$setValidity('jsondate', true); return dateFilter(newDate, dateFormat); }); } }; });

注意：只能在 ng-repeat 之外工作。您必须使用“长”指令格式才能使其工作：http ://docs.angularjs.org/guide/directive

于 2013-06-07T03:07:59.823 回答