AngularJS内联检查数组是否存在元素

Question

在AngularJs中，内联方式是否有一种方法可以检查某个内容是否为数组？

我本以为以下方法会起作用：

<div ng-show="Array.isArray(textStuff[0][1])">Hi</div>

我已验证它确实是一个数组。我是否遗漏了什么或者还有其他方法？

- Adam

---

只需在代码中添加 ng-show="isArray()"，然后在你的控制器中加入 $scope.isArray = function(){ return Array.isArray(textStuff[0][1]) }。 - Ronnie

Answer 1

您可以在作用域上放置angular.isArray...

$scope.isArray = angular.isArray;

---

<div ng-show="isArray(textStuff[0][1])">Hi</div>

示例代码

- Anthony Chu

Answer 2

你可以创建全局过滤器，用于在JS或HTML中检查对象类型。这样，您就不会像原答案那样污染您的$rootScope或$scope以便在任何地方使用。Angular还具有一些内置实用程序函数，可以检查对象类型：

angular
    .module("yourModule")
    .filter("isArray", function() {
        return function(input) {
            return angular.isArray(input);
        };
    });

在HTML中：

<div ng-show="{{ textStuff[0][1]) | isArray }}">Hi</div>

您还可以将 $filter 服务注入到控制器中，通过名称访问自定义过滤器，并在实例化控制器时（以及数据更改时）计算过滤结果。这可以防止由于视图表达式快速计算而导致的性能问题。

angular
    .module("yourModule")
    .controller("MyController", MyController);

MyController.$inject = ["$filter", "$scope"];

function MyController($filter, $scope) {

    this.testStuff = []; // your data
    this.filteredResult = $filter("isArray")(this.testStuff[0][1]);

    // or if you need to watch for data changes
    var vm = this;

    $scope.$watchCollection(
        function() { return vm.testStuff },
        function(newTestStuff) {  
            vm.filteredResult = $filter("isArray")(newTestStuff[0][1]);
        } 
    );
}

<div ng-controller="MyController as my">
    <div ng-show="my.filterResult">Hi</div>
</div>

- SirTophamHatt

---

这是一个更好（也更聪明）的解决方案。与函数作用域答案不同，这实际上是可测试的，因为您可以注入自己的命名过滤器。 - icfantv

Answer 3

我会将逻辑和视图分开。将状态添加到作用域中，然后再进行检查。

 $scope.showHi = angular.isArray(textStuff[0][1]);

在视图中

<div ng-show="showHi">Hi</div>

- Lukasz Madon

---

不要在作用域中存储基本类型，尽管作用域可以继承，但是作用域中的基本类型是复制而不是引用。 - icfantv