动态选择元素在角滤波 [英] Dynamic select element filtering in Angular

问题描述

我使用的是的 NG-重复以迭代对象为角显示和这些对象包含包含对象的属性选择元素。

I am using an ng-repeat to iterate over objects for displaying in Angular and each of these objects contains a select element containing a property of the object.

我想筛选基于关闭每个对象的其他属性（噢，这是难以解释比我想象的），但问题是，这是微风实体和所选择的价值选择，如果我用传统的方法角提供堆栈抛出溢出异常由于微风实体的循环性质。

I want to filter options based off the selected value for each of the objects' other properties (whew, this is harder to explain than I thought) but the problem is that these are Breeze entities and if I use the traditional method Angular provides the stack throws an overflow exception due to the cyclic nature of Breeze entities.

我对如何创建一个更静态函数来处理过滤发现了一个很好的例子，由Ward，但我想使它更具活力和很努力 -

I have found a good example by Ward on how to create a more static function to handle the filtering, but I am trying to make it more dynamic and am struggling -

在认为我有可用的战斗机，这应该由打架重量级别进行过滤的列表，以便在NG-重复的战斗每次吵架有一个重量级别选择器和两个战士选择 -

In the view I have a list of available fighters, which should be filtered by a fights' weight class, so for each fight in the ng-repeat's fights there is a weight class selector, and two fighter selectors -

尝试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的价值。

I have tried sending nothing as shown, but the problem is it only sends the fighter's value as it iterates through each available fighter, so I can't get the value of the fight.weightClass.

如何获得斗争中，我遍历战斗机的任何想法？或者更好的方法来过滤这种方式？

Any idea of how to get the context of fight and the fighter I am iterating over? Or a better approach to filtering this way?

战士结构

1. 战士

1. Fighter

• 标识


• 名称


• WeightClassId


• WeightClass（导航属性）

战斗

• FirstFighter


• SecondFighter


• WeightClassId


• WeightClass（导航属性）

WeightClass

WeightClass

• 标识


• 重量


• 说明


• 全名

修改

我已经能够筛选S单斗争的结果没有问题，问题是如何动态地处理这个在每场战斗的基础在NG-重复指令下了同样的观点。我不能让打和斗士的背景下，比较两个实体的重量级别的值是否匹配。

I have been able to filter results for s single fight without a problem, the problem is how to dynamically handle this on a per fight basis in the same view under the ng-repeat directive. I cannot get the context of 'fight' and 'fighter' to compare whether the 'weight class' value of both entities match.

推荐答案

过滤器可以采取前pression 为对象的格式为 {字段名：值}

Filter can take a expression as an Object in the format of {fieldName:value}.

您可以使用 |过滤器：{WeightClassId：fight.WeightClass.Id} 来实现你想要的。

You can use | filter: {WeightClassId:fight.WeightClass.Id} to achieve what you want.

<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>

<大骨节病> 演示

这篇关于动态选择元素在角滤波的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！