ng-repeat 循环

angularjs中ng-repeat循环类似于$.each功能,循环元素<div ng-repeat='p(循环体起名)in 循环体'>p.xxxxx(循环体操作)</div>

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <script src="angular.js"></script>
</head>
<body>
<!--方式控制器必须在定义的模型之内即ng-app -->
<div ng-app="mymodule1"><!--模型定义-->
    <div ng-controller="mycontroller1">
        <ul>
            <li ng-repeat="p in relate"><!--循环元素-->
                <a ng-href="{{p.website}}">{{p.name}}</a> <span>{{p.gender}}</span>
            </li>
        </ul>
    </div>

</div>

<script>
    var mymodule=angular.module("mymodule1",[]);
    mymodule.controller('mycontroller1',function($scope){
            $scope.relate=[{'name':'张三','gender':'李四','website':'www.baidu.com'},{'name':'张飞','gender':'李逵','website':'www.baidu.com'},{'name':'刘虎','gender':'女','website':'www.baidu.com'}];
    })


</script>

</body>
</html>

 


显示结果:

 


posted @ 2017-01-12 13:30  司马懿是一朵小花  阅读(235)  评论(0编辑  收藏  举报