angular绑定数据 使用循环输出列表数据

时间：2022-07-03 17:27:34
<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8">

    <script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>

</head>

<body  ng-app ng-init="obj={ a:1,b:2,firstName:'guanghan',lastName:'xue'}">

    <div>

        <p>我的第一个表达式: {{ obj.a*obj.b }}</p>

        <span ng-bind="obj.firstName"></span>

        <span >{{obj.lastName}}</span>

        <input type="text" name="firstName"  ng-model="obj.firstName" />

        <input type="text" name="lastName"   ng-model="obj.lastName" />

    </div>

    <div   ng-init="name=['a1','a2','a3']">

        <ul>

            <li ng-repeat="x in name">

                 {{ x }}

            </li>

        </ul>

    </div>

    <!--<script>

        $(function () {

            angular.bootstrap($("dir"), ['dir']);

        })

    </script>-->

</body>

</html>

　　相比拼接字符串 会优雅很多 阅读性也很强 逻辑清晰

相关文章