Question

我正在尝试将一个类应用于元素，具体取决于他们的＆＃39;类别＆＃39;属性，同时与用户也可以创建的动态类别列表交互。

分类数组：

$scope.categories = [{
    category: "work",
    id: 1
  }, {
    category: "life",
    id: 2
  ];

Todos数组：

$scope.todos = [{
        name: "Lift Up Hats",
        category: "life",
        date: "tomorrow"
    }, {
        name: "Wash the Horse",
        category: "work",
        date: "tomorrow"
    }];

我实际要做的是：

A）循环todos数组中的所有内容。到目前为止这样做：

<li class="{{todo.category}}-item" ng-repeat="todo in todos | orderBy: 'completed'">

然而，这取决于被称为＆＃34; life-item＆＃34;，＆＃34; work-item＆＃34;我想在categories数组中使用ID。

B）如果抬起帽子＆＃39;有一个＆＃39; life＆＃39;类别，从categories数组中为它分配类别生命的ID。例如，生活将导致＆＃34; 1-item＆＃34; ，工作将导致＆＃34; 2项＆＃34;等

我已经研究过使用.map函数了，但是我似乎必须重新调整整个应用程序中数组的操作方式。

非常感谢一些帮助/建议。

TL; DR：我正在尝试将一个类应用于从一个数组循环的ng重复项，其中该类是另一个数组中属性匹配的属性。

Answer 1

您可以使用过滤器提供查找

注意：我偷了过滤器＆＃34; fromNative＆＃34;在某个地方，我不记得很抱歉，不提供那个

的学分

＆＃13;

var app = angular.module('myApp', []);

app.controller('MainCtrl', function($scope) {

  
  $scope.categories = [{
    category: "work",
    id: 1
    }, {
    category: "life",
    id: 2
    }
  ];
  
  $scope.todos = [{
    name: "Lift Up Hats",
    category: "life",
    date: "tomorrow"
  }, {
    name: "Wash the Horse",
    category: "work",
    date: "tomorrow"
  }];
});

app.filter('fromNative', function () {
    return function (native, options, matchField, valueField) {
        if (options) {
            for (var i = 0; i < options.length; i++) {
                var o = options[i][matchField];
                if (o === native) {
                    return options[i][valueField];
                }
            }
        }
        return '';
    }
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<ul ng-app="myApp" ng-controller="MainCtrl">
  <li ng-repeat="todo in todos | orderBy: 'completed'">
    with {{todo.name}} my lookup is <b>{{ todo.category | fromNative : categories : 'category' :'id' }}</b>
  </li>
</ul>

＆＃13;

修改我已经更换了我的待办事项以匹配您的样本

Answer 2

以下jQuery代码可以帮助您：

angular.forEach($scope.todos, function(i, todoOb){
    angular.forEach($scope.categories, function(cat_i, catOb){
        if(todoOb.category == catOb.category){
            todoOb.id = catOb.id;
        }
    });
});

<强> HTML

<li class="{{todo.id}}-item" ng-repeat="todo in todos | orderBy: 'completed'">

这会将类别中的正确键添加到todos数组对象元素。

匹配AngularJS中不同范围的值

2 个答案: