数据未传递给AngularJs中的视图

时间:2015-02-18 09:10:11

标签: angularjs model-view-controller

我正在尝试将数据提取到表中,使用工厂方法获取跨源策略错误,因此尝试使用硬编码数据。但它无法正常工作。以下是示例index.html文件。

Index.html

<html ng-app="sample">

<head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.13/angular.min.js"></script>
    <script src="bootstrap/js/bootstrap.min.js"></script>
</head>

<body ng-controller="test">
    <div>
        <div>
            <table>
                <thead>
                    <tr>
                        <td>#</td>
                        <td>Order</td>
                        <td>Details</td>
                        <td></td>
                    </tr>
                </thead>
                <tbody>
                    <tr ng-repeat="order in orders">
                        <td>{{order.id}}</td>
                        <td>{{order.number}}</td>
                        <td>{{order.details}}</td>
                        <td><a href="showDetails()">show details</a>
                        </td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
</body>
<script>
    var sample = angular.module("sample", []);
    sample.controller("test", function($scope) {
        var person1 = [{
            id: "1",
            number: "1234",
            details: "samsung mobile"
        }];
        var person2 = [{
            id: "2",
            number: "1235",
            details: "motorola mobile"
        }];
        var person3 = [{
            id: "1",
            number: "1236",
            details: "MI3 mobile"
        }];
        var person = [person1, person2, person3];
        $scope.orders = person;
    });
</script>

</html>

我哪里错了?任何帮助将不胜感激。感谢。

2 个答案:

答案 0 :(得分:2)

你的人是阵列,他们应该只是对象,例如

var person1 = {id:"1",number:"1234",details:"samsung mobile"};

请参阅: http://embed.plnkr.co/uuzg1KuZUDP5cJQhhJQ5/preview

答案 1 :(得分:0)

 sample.controller("test",function($scope){
        $scope.orders=
            [
             {id:"1",number:"1234",details:"samsung mobile"},
             {id:"2",number:"1235",details:"motorola mobile"},
             {id:"1",number:"1236",details:"MI3 mobile"}
            ];
        });