Question

我编写了一个简单的ASP.NET WEBApi，它返回了客户列表，我正在尝试绑定到UI。

在我的WEB Api控制器下面找到：

    public class DummyController : ApiController
    {
        public HttpResponseMessage Get()
        {
            List<Customer> customers = new List<Customer>();
            Customer customer = new Customer();
            customer.FirstName = "John";
            customer.LastName = "Doe";
            customers.Add(customer);
            customer = new Customer();
            customer.FirstName = "Mike";
            customer.LastName = "Doobey";
            customers.Add(customer);

            HttpResponseMessage result = null;
            result = Request.CreateResponse(HttpStatusCode.OK, customers);
            return result;
        }
    }

角度控制器：

<script type="text/javascript">
    function dummyCtrl($scope) {
        $.getJSON("http://127.0.0.1:81/Api/dummy", function (resp) {
            $scope.dummy = resp;
            $scope.json = angular.toJson(resp);
            console.log($scope.json);
        });
    }
</script>

执行角度控制器：

<body ng-controller="dummyCtrl">
    <div>
        <ul>
    <li ng-repeat = "person in dummy">
        <span>{{person.FirstName}}</span>
        <span>{{person.lastname}}</span>
    </li>
        </ul>
    </div>
</body>

我可以在Chrome开发者工具中查看JSON数据，但无法在浏览器中看到输出。

[{"FirstName":"John","LastName":"Doe"},{"FirstName":"Mike","LastName":"Doobey"}] :81/:24
[{"FirstName":"John","LastName":"Doe"},{"FirstName":"Mike","LastName":"Doobey"}] :81/:24

我做错了什么？

Answer 1

您应该在XmlHTTPRequest周围使用angularJS'自己的Wrapper，它会自动进行$ digest。所以将代码更改为：

function dummyCtrl($scope, $http) {
    $http.get("http://127.0.0.1:81/Api/dummy").then( function (resp) {
        $scope.dummy = resp.data;
        $scope.json = angular.toJson(resp.data);
        console.log($scope.json);
    });
}

有关详细信息，请参阅此处：Angular $http reference

无法绑定到ng-repeat

1 个答案: