ng-repeat指令

来源:互联网 发布:七周年荣耀赛车数据 编辑:程序博客网 时间:2024/05/16 16:55
<!DOCTYPE html><html ng-app="optionsExample"><head>    <meta charset="UTF-8">    <title></title>    <script src="../js/angular.js"></script>    <script src="../js/angular-animate.js"></script>    <script>        angular.module('optionsExample', [])                .controller('ExampleController', ['$scope','$filter', function($scope, $filter)                {                    $scope.friends =[                    {name:'John', age:25, gender:'boy'},                    {name:'Jessie', age:30, gender:'girl'},                    {name:'Johanna', age:28, gender:'girl'},                    {name:'Joy', age:15, gender:'girl'},                    {name:'Mary', age:28, gender:'girl'},                    {name:'Peter', age:95, gender:'boy'},                    {name:'Sebastian', age:50, gender:'boy'},                    {name:'Erika', age:27, gender:'girl'},                    {name:'Patrick', age:40, gender:'boy'},                    {name:'Samantha', age:60, gender:'girl'}                    ];                }]);    </script></head><body><div ng-controller="ExampleController">        I have {{friends.length}} friends. They are:        <input type="search" ng-model="q" placeholder="filter friends..." />        <ul class="example-animate-container">            <li class="animate-repeat" ng-repeat="friend in friends | filter:q">                [{{$index + 1}}] {{friend.name}} who is {{friend.age}} years old.            </li>        </ul>    </div></div></body></html>

0 0