1

我正在使用ng-repeat迭代对象以在 Angular 中显示,并且每个对象都包含一个包含对象属性的选择元素。

我想根据每个对象的其他属性的选定值过滤选项(哇,这比我想象的更难解释)但问题是这些是微风实体,如果我使用传统方法 Angular 提供堆栈由于 Breeze 实体的循环性质,引发溢出异常。

我找到了 Ward 的一个很好的例子,说明如何创建一个更静态的函数来处理过滤,但我正试图让它更具动态性并且正在苦苦挣扎 -

在视图中,我有一个可用战斗机列表,应按战斗的重量等级过滤,因此对于 ng-repeat 战斗中的每场战斗,都有一个重量等级选择器和两个战斗机选择器 -

尝试 1 -

<select
    ng-model="fight.firstFighter"
    ng-options="f.fullName for f in fighters | filter: fighterFilter">
</select>

<select
    ng-model="fight.weightClass"
    ng-options="w.fullName for w in weightClasses">
</select>

$scope.fighterFilter = function (fighter) {
    var fight = ???;
    return fight.weightClass ?
        -1 != fighter.weightClass === fight.weightClass :
        true;
};

我尝试过如图所示不发送任何内容,但问题是它只发送战斗机的值,因为它遍历每个可用的战斗机,所以我无法获得 fight.weightClass 的值。

关于如何获得战斗背景和我正在迭代的战斗机的任何想法?还是以这种方式过滤的更好方法?

战斗机结构

  1. 战斗机

    • ID
    • 姓名
    • 权重类 ID
    • WeightClass(导航属性)
  2. 斗争

    • 第一战斗机
    • 第二战斗机
    • 权重类 ID
    • WeightClass(导航属性)
  3. 重量等级

    • ID
    • 重量
    • 描述
    • 全名

编辑

我已经能够毫无问题地过滤单场战斗的结果,问题是如何在 ng-repeat 指令下的同一视图中以每场战斗为基础动态处理此问题。我无法获得“战斗”和“战斗机”的上下文来比较两个实体的“重量等级”值是否匹配。

4

1 回答 1

2

过滤器可以expression采用Object.{fieldName:value}

你可以用它| filter: {WeightClassId:fight.WeightClass.Id}来实现你想要的。

<li ng-repeat="fight in fights">
    <h4>{{ fight.number }}</h4>

    Weight Class:
    <select ng-model="fight.WeightClass" ng-options="w.Name for w in weightClasses"></select>{{ fight.WeightClass.Name }}

    <br/>First Fighter
    <select ng-model="fight.FirstFighterId" ng-options="f.Name for f in fighters | filter: {WeightClassId:fight.WeightClass.Id}"></select><span>{{ fight.FirstFighter.Name }}</span>

    <br/>Second Fighter
    <select ng-model="fight.SecondFighterId" ng-options="f.Name for f in fighters| filter: {WeightClassId:fight.WeightClass.Id}"></select><span>{{ fight.SecondFighter.Name }}</span>
</li>

Demo

于 2013-08-16T16:48:18.403 回答