ng-repeat重复元素问题

来源：互联网发布：网络推广是传销吗编辑：程序博客网时间：2024/06/05 05:44

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>Title</title>    <script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>    <!--            ng-repeat解决元素重复:            语法:             ng-repeat="index in myScope track by $index "    -->    <script>        var app = angular.module('myApp',[]);        app.controller('myController',function($scope){            $scope.myScope = [                {'name':'aaa'},{'name':'bbb'},{'name':'aaa'},{'name':'ccc'},{'name':'ddd'},{'name':'eee'},{'name':'bbb'}            ];        });    </script></head><body ng-app="myApp" ng-controller="myController">    <div ng-repeat="obj in myScope track by $index">        <!--当为数组有重复时一般报错 需用track by $index 处理  对象没事-->        <span>{{obj.name}}</span>    </div></body></html>

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>Title</title>    <script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>    <script>        var app = angular.module('myApp',[]);        app.controller('myController',function($scope){            $scope.myScope = {//            nameArray :[1,1,2,3,4,5,6]                nameArray:[                    {'name':'aaa'},{'name':'bbb'},{'name':'aaa'},{'name':'ccc'},{'name':'ddd'},{'name':'eee'},{'name':'bbb'}                ]            }        });    </script></head><body ng-app="myApp" ng-controller="myController"><div ng-repeat="index in myScope.nameArray track by $index ">    <!--当为数组有重复时一般报错 需用track by $index 处理  对象没事-->    <button>{{index}}</button></div></body></html>

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>Title</title>    <script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>    <script>        var myapp=angular.module('myapp',[]);        myapp.controller('test',function($scope){            $scope.arr=['aa','bb','cc','dd','cc']            $scope.obj=[                {'name':'same1'},                {'name':'same2'},                {'name':'same3'},                {'name':'same4'},                {'name':'same1'}            ]        });    </script></head><body><div ng-app="myapp" ng-controller="test">    <ol>        <li ng-repeat="x in arr track by $index">            <p ng-if="x=='aa'">{{x}} </p>            <p ng-if="x=='bb'">{{x}}</p>            <p ng-if="x=='cc'">{{x}}</p>            <p ng-if="x=='dd'">{{x}}</p>        </li>    </ol>    <ol>        <li ng-repeat="y in obj" ng-switch on="y.name">            <p ng-switch-when="same1">{{y.name}}</p>            <p ng-switch-when="same2">{{y.name}}</p>            <p ng-switch-when="same3">{{y.name}}</p>            <p ng-switch-when="same4">{{y.name}}</p>         </li>    </ol></div></body></html>

阅读全文

0 0