在ng-if内部比较两个数组。

14 浏览
0 Comments

在ng-if内部比较两个数组。

我在一个类中有一个数组，并且我必须比较两个相同类的不同对象中的数组是否相同。目前，我是这样做的，\n

{{ctrl.Obj1.arr1}}

\n但这是一种不正确的比较方法，因为它产生了不同的值。我的数组的形式是：[\"string1\",\"string2\",\"string3\"]\n正确的做法是什么？\n编辑：我的问题不同，因为我在询问如何在AngularJS中完成这个操作。

0

2 答案

0 Comments

问题的出现原因是，需要比较两个数组是否相等，但是在AngularJS中，直接使用"=="或"==="操作符对两个数组进行比较会得到错误的结果。解决方法是使用angular.equals()函数来比较两个数组。

在上述代码中，使用了ng-if指令来判断当ctrl.Obj2不为null且ctrl.Obj1.arr1与ctrl.Obj2.arr1不相等时显示一个警告图标。在ng-if的表达式中，通过调用angular.equals(ctrl.Obj1.arr1, ctrl.Obj2.arr1)来比较两个数组是否相等。

为了使用angular.equals()函数，需要在主应用控制器中添加$scope.angular = angular;这一行代码。

这样，通过使用angular.equals()函数来比较两个数组，就可以在AngularJS中实现数组的比较操作了。

0
0 Comments

问题出现的原因：

在模板中进行数组比较的过程中，不应该直接进行比较，而是应该使用一个函数来进行比较，并将其绑定到模板上。这样可以避免在模板中写入复杂的比较逻辑。

解决方法：

在控制器中定义一个比较函数，该函数将比较两个数组的长度和每个元素的值是否相等，并返回布尔值。然后将该函数绑定到模板中的ng-if指令上。

代码示例：

ng-if="compareArrays()"
$scope.compareArrays = function(){
    var result = $scope.array1.length == $scope.array2.length && $scope.array1.every(function(element, index) {
        return element === $scope.array2[index]; 
    });
    return result;
}

另外，可以使用array2.includes(element)来进行比较，这样可以避免对数组的顺序有依赖性。同时，也可以使用every函数来进行比较，它是ES6的一部分。

如果想在不同的地方使用该函数，可以直接在控制器中调用该函数并传递参数，不需要重复定义比较函数。例如，使用ng-if指令时可以这样写：

ng-if="compareArrays(Obj1.A1.arr1, Obj2.A1.arr2)"
ng-if="compareArrays(Obj1.A2.arr1, Obj2.A2.arr2)"

最后，如果对该问题还有疑问，可以在这里的聊天室继续讨论。

0