ng-repeat 循环

最新推荐文章于 2021-04-15 10:05:08 发布

weixin_30319153

最新推荐文章于 2021-04-15 10:05:08 发布

阅读量80

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/bellagao/p/6277837.html

版权

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>


显示结果：

转载于:https://www.cnblogs.com/bellagao/p/6277837.html

weixin_30319153

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
ng-repeat 循环

angularjs中ng-repeat循环类似于$.each功能，循环元素<div ng-repeat='p(循环体起名)in 循环体'>p.xxxxx(循环体操作)</div><!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8">...
复制链接

扫一扫