angularjs-ng-repeat

最新推荐文章于 2021-08-07 10:08:36 发布

原创最新推荐文章于 2021-08-07 10:08:36 发布 · 483 阅读

0 ·

CC 4.0 BY-SA版权

angularjs 同时被 2 个专栏收录

38 篇文章

订阅专栏

angularjs

37 篇文章

订阅专栏

1、angularjs程序中获取点击item的position：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="https://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>
</head>
<body ng-app="myApp" ng-controller="myCtrl">

<h1 ng-repeat="x in records" ng-click="click($index)">{{x}}   的下标是：{{$index}}</h1>

<script>
var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope) {
  $scope.records = [
    "菜鸟教程1====",
    "菜鸟教程2----",
    "菜鸟教程3++++",
    "菜鸟教程4****",
  ]

  $scope.click=function(index){
      alert(index);
  }

});
</script>

</body>
</html>

效果：

Markdown

2、报错：

angular.js:13424 Error: [ngRepeat:dupes]
http://errors.angularjs.org/1.5.3/n

出现这个错误的原因是如果页面中使用了ng-repeat，angularjs默认是根据里面的内容判断是否相同的，如果里面出现相同的内容就会报错，这里要注意的是，比如如下的内容：

ng-repeat="user in [1,1]"

一般在实际开发中，我们一般是一个数组存一个对象，这是里面的值都是Object，如下面的保存

ng-repeat="user in [{user:1},{user:2}]"

其实数组里面保存的是：

[Object,Object]

这时就会抛出Error: [ngRepeat:dupes] 这个错误，解决的方法也很简单，在ng-repeat中加入如下代码（注意：如果有filter这些的时候，这段代码要加载最后面）如：

track by $index

ng-repeat="user in users track by $index"

ng-repeat="user in users | filter:{nick:searchNick} track by $index"

参考：

angularjs Error ngRepeat:dupes