0

我有一个带有无序键的数组,我想显示它们。问题是 angular 会为所有键重复它,即使它们没有设置。

这是代码:

<div ng-controller="MyCtrl">
  Hello, {{a[10]}}!

    <p ng-repeat="b in a">
        1. {{b}}
    </p>
</div>

<script>
var myApp = angular.module('myApp',[]);

function MyCtrl($scope) {
    $scope.a = [];
    $scope.a[10] = "aaa";
}
</script>

这是输出:

Hello, aaa!
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1. aaa

我只想要设置为输出的数组键。请不要空b... 这是一个jsfiddle

4

2 回答 2

4

本质上,您的问题与 AngularJS 无关,而是与 JavaScript 的工作方式有关。

如果您有一个空数组并且您将一个元素分配给位置 10,那么 JavaScript 会自动将数组大小调整为 11 个元素(因为数组索引从零开始),因此索引足够大以容纳您的元素。

您可以编写额外的代码来过滤空元素,但根据您编写的内容,我认为您最好使用对象来存储数据。

为了您的方便,我创建了一个 plnkr:http ://plnkr.co/edit/apRLuJr4zqS2zbMz322Q?p=preview

// Array
$scope.sampleArray = [];
$scope.sampleArray[10] = 'test';

// Object
$scope.sampleObject = {};
$scope.sampleObject[10] = 'test';

如您所见,语法非常相似,但输出完全不同。

通过使用对象,您将自动消除空行。

它还将使您的代码更简单,因为您不必处理空数组元素。

希望有帮助!

于 2013-06-23T11:24:52.140 回答
1

有很多方法可以对控制器内部的数组进行清理(例如,在它发生变化时使用$watch回调将删除其中的空元素)。a

这是一个使用在控制器中定义的简单自定义过滤器的解决方案:

function MyCtrl($scope) {
    $scope.namea = 'Superhero';
    $scope.a = [];
    $scope.a[10] = "aaa";

    $scope.myFilter = function(item){
        return item;
    }
}

<p ng-repeat="b in a | filter:myFilter">
  1. {{b}}
</p>

过滤器文档中所述,“过滤器”过滤器可以采用以下功能:

函数:谓词函数可用于编写任意过滤器。为数组的每个元素调用该函数。最终结果是谓词返回 true 的那些元素的数组。

于 2013-06-21T23:27:50.003 回答