- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
目前,我的应用程序当前显示练习,然后使用选择选项按肌肉群过滤它们。我正在努力了解如何最初显示所有这些。
应用程序加载后,它就已经被肌肉群过滤了,或者如果它被“all”值过滤,它不会显示任何内容,因为这不是我的 JSON 中指定的肌肉群。它的组织方式如下:
选择调用过滤器的选项(肌肉过滤器只是所有肌肉群的数组)
<div class="form-group">
<label for="muscle">Show:</label>
<select id="muscle" ref="muscle">
<option value="all">All</option>
<option repeat.for="muscle of muscleFilters" value.bind="muscle">${muscle}</option>
</select>
</div>
显示
<div class="col-sm-6 col-md-3" repeat.for="exercise of exercises | sortMuscle:muscle.value">
${exercise.title}
</div>
排序功能
export class SortMuscleValueConverter {
toView(array, propertyName) {
return array
.slice(0).filter(function (i) {
return (i.muscle === propertyName);
});
}
}
选择“全部”选项时如何显示所有数据?我还有一个搜索功能,需要在提交时清除所有过滤器,以便它可以搜索所有数据。
提前致谢。
最佳答案
您可以在值转换器中使用简单的 if
语句:
// Note: convertor name is misleading - it does filtering, not sorting
export class SortMuscleValueConverter {
toView(array, propertyName) {
if (propertyName === 'all') {
return array;
}
// Simplified filter
return array.filter(i => i.muscle === propertyName);
}
}
<小时/>
作为替代方案,这里有一个通用的 FilterValueConverter
,您可以使用它来过滤任何属性(使用相等性):
export class FilterValueConverter {
toView(array, propertyName, filter) {
if (!filter) {
return array;
}
return array.filter(item => item[propertyName] === filter);
}
}
用法:
<!-- option for All needs to have an empty value -->
<option value="">All</option>
<div class="col-sm-6 col-md-3"
repeat.for="exercise of exercises | filter:'muscle':muscle.value">
${exercise.title}
</div>
关于javascript - 显示 Aurelia 值转换器上的所有筛选器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36729765/
我在完成这个用于转换咖啡价格的 JavaScript 时遇到问题。我下载了一个调试器,它一直告诉我价格未定义,我不明白。这是脚本。 Coffee House
我有一个使用以下方法的 JSF 转换器: @Override public Object getAsObject(FacesContext context, UIComponent compo
我正在寻找类似paint.net 或Gimp 的东西,但对于音频文件,并在Windows 上运行。 最佳答案 Audacity太棒了 关于audio - 免费的声音编辑器/转换器?,我们在Stack
我目前正在使用以下代码来缩进 XML: transformer.setOutputProperty(OutputKeys.INDENT, "yes"); transformer.setOutputPr
我收到以下错误:Conversion Error setting value 'home' for 'null Converter'. Home是所显示内容的字符串表示形式。 对我来说,这没有意义。这
我的 UI 中有很多数字要处理。我希望它们中的一些没有小数位,一些是小数点后 2 位,而另一些是小数点后(3 位或 4 位小数)。 我有一个名为 DoubleToStringConverter 的转换
我正在制作一个货币转换器。转换器需要一个最小范围和最大范围,如果货币值高于或低于这些范围,转换器将要求您更改范围以能够转换货币。例如,如果用户将范围设置在 min-range 3 和 max-rang
我正在使用 Spring Shell 2 CLI,并尝试通过反射在运行时从定义的接口(interface)生成命令。 更新:接口(interface)的实现也是在运行时生成的。 我正在使用 Confi
我正在尝试编写一个通用的 Converter 以在我的代码中的多个类似情况下使用。我有一组子类,我只想使用一个 Converter 来处理,所以我想将一些东西(类类型/一些参数/等)传递给 Conve
我正在尝试读取一个在每个单元格中包含多个值的 csv 文件,并且我想将它们编码为单个 int 格式的字节以存储在 Pandas 单元格中,(例如 (1, 1) -> 771)。为此,我想使用 read
我正在 VC2013 中开发一个 c# Windows Phone 8.1 应用程序,并偶然发现了一个奇怪的问题。 为了使我的代码更“干净”,我决定将应用程序的不同部分放入不同的文件夹中。在 c# 代
是否有将 Puppet 脚本转换为 Chef 的转换器? 我找到了将 Chef 脚本转换为 Puppet 的 ruby 脚本 https://github.com/relistan/chef2pu
我已经开始寻找很好的解决方案,如何使用 Spring CassandraOperations 很好地持久化实体。问题开始是因为我的实体中的某些字段不受 cassandra 支持,例如乔达日期时间。 解
我知道如何实现单链表 monad 转换器,但无法运行其对应的数组。问题是存在分组效应,这使得转换器仅对可交换基 monad 有效。这是一个示例,为了简单起见,转换器和基础 monad 都是数组,并且没
当我尝试将值转换器从定义的枚举状态绑定(bind)到刷子时,我的 XAML 设计器中出现错误: 未找到“OKStatus”资源。 该应用程序在运行时运行良好,但我无法在设计器中看到我的 GUI。 我的
我需要使用列表单子(monad)变压器。我读到 ListT IO 存在潜在问题来自 Control.Monad.List , 自 IO不是可交换的,所以我在看 ListT done right .但我
不用多想,在我看来,一大组 Prolog 的功能可以实现为关系演算(a.k.a. SQL)。 有没有人听说过任何工具可以自动将 Prolog 转换为 SQL? 最佳答案 推荐: https://www
假设我在十六进制值(包括 alpha)中有这种颜色: x [1] "255 36 0" 但是,查看您请求的结果,您似乎在 x 中将 alpha 值作为第一个十六进制数。 - 所以你需要创建一个子字符
我正在寻找可用于跟踪程序进度的 monad 转换器。要解释如何使用它,请考虑以下代码: procedure :: ProgressT IO () procedure = task "Print som
我有一个非常基本的需求,即从数据库中获取一些数据并返回一个 DTO。我发现使用 nHibernate 连接多个表和“投影”可以说,到 DTO 是相当多的代码。在查看了几个示例后,大多数示例都不起作用,
我是一名优秀的程序员,十分优秀!