Question

我有这些数组对象

  $scope.alterations = {
    'collar' : { name: 'collar', selected: false, qualitative: 'Perfect' },
    'chest' : { name: 'chest', selected: false, qualitative: 'Perfect' },
    'shoulder' : { name: 'shoulder', selected: false, qualitative: 'Perfect' },
    'waist' : { name: 'waist', selected: false, qualitative: 'Perfect' },
    'hips' : { name: 'hips', selected: false, qualitative: 'Perfect' },
    'sleeve' : { name: 'sleeve', selected: false, qualitative: 'Perfect' },
    'biceps' : { name: 'biceps', selected: false, qualitative: 'Perfect' },
    'wrist' : { name: 'wrist', selected: false, qualitative: 'Perfect' },
    'length' : { name: 'length', selected: false, qualitative: 'Perfect' },
  };

   // watch alterations for changes  
 $scope.$watch('alterations|filter:{selected:true}', function (nv) {
     $scope.alter = nv.map(function (alterations) {
       return alterations;
     });   }, true);

如果我想在数组中只获取选中的区域，那么我需要在我的过滤器中进行哪些更改？

我在地图方法中遇到了这些错误

TypeError: Object #<Object> has no method 'map'

更新：

之前它使用这些数组结构：

  $scope.alterations = [
        { name: 'collar', selected: false, qualitative: 'Perfect' },
        { name: 'chest', selected: false, qualitative: 'Perfect' },
        { name: 'shoulder', selected: false, qualitative: 'Perfect' },
        { name: 'waist', selected: false, qualitative: 'Perfect' },
        { name: 'hips', selected: false, qualitative: 'Perfect' },
        { name: 'sleeve length', selected: false, qualitative: 'Perfect' },
        { name: 'biceps', selected: false, qualitative: 'Perfect' },
        { name: 'wrist', selected: false, qualitative: 'Perfect' },
        { name: 'shirt length', selected: false, qualitative: 'Perfect' }
  ];

Answer 1

尝试这个js小提琴，它正在使用你的新数据结构。 http://jsfiddle.net/8mXD7/我已将此更改包含在内。有关完整代码，请参阅jsfiddle。

// watch alterations for changes  
$scope.$watch('alterations|filter:{selected:true}', function (nv, ov, scope) {

$scope.alter = [];
angular.forEach(nv, function (value, key) {
    if (value.selected == true) {
        this.push(value);
    }
}, $scope.alter);
}, true);

我摆脱了地图，并将其替换为angular.forEach。这也意味着您不需要对完整jquery库的引用，您只需使用内置的jqlite。

更新为替代

这是一种具有自定义过滤功能的替代方法。请注意，您需要使用模块注册过滤器并更新ng-app以指向新模块。

http://jsfiddle.net/TpM4T/ - 请参阅jsfiddle获取完整源代码，此代码与上面使用的代码不同。

angular.module('example', []).
filter('customFilter', function () {
    return function (arr) {
        var alter = [];
        angular.forEach(arr, function (value, key) {
            if (value.selected == true) {
                this.push(value);
            }
        }, alter);
        return alter;
    }
});

更新另一个替代

此方法使用过滤器服务，实际上阻止了其中一个NAIVE阵列副本。

http://jsfiddle.net/Qxew8/ - 此示例演示了一个可用作函数或过滤器的常规函数。

angular.module('example', []).
filter('customFilter', function () {
    return makeArrayOfSelected
});

function makeArrayOfSelected(arr) {
    var alter = [];
    angular.forEach(arr, function (value, key) {
        if (value.selected == true) {
            this.push(value);
        }
    }, alter);
    return alter;
};

所以在手表中它只是调用过滤服务：

// watch alterations for changes  
$scope.$watch('alterations', function (nv, ov, scope) {
    $scope.alter = $filter("customFilter")(nv);
}, true);

angularjs注意多维数组的变化

1 个答案: