javascript - 根据搜索字符串结果切换模型

标签 javascript angularjs angularjs-ng-repeat

我想做的是找到一种简单的方法来根据搜索字符串结果切换模型,我制作了一个快速概念示例来帮助可视化;

JSFiddle

我在提供的示例中具有其模型 blah 的每个项目中都有一个切换按钮。

我一直失败的是想出一种方法来表示,例如如果 search=name.phone 那么 blah=false 或者如果用于搜索的字符串是 name.phone 并且本质上使用搜索字符串将方 block 切换为红色它在搜索结果中,至少有希望传达了这个概念。

现实情况是,我的项目模板中有一些部分最初可能会隐藏,但它们仍然会产生搜索结果,但在结果中不可见。因此,如果它们是搜索到的内容,我希望用户可以看到它们。有道理吗?

我希望它可能像这样简单;

 <div ng-class="{'style-it red':blah,
                 'style-it green':!blah,
                 'style-it red':search=name.phone}"></div>

..或者类似的东西。或者可能是来自搜索输入的内联三元数或其他内容?我可以展示更多失败的尝试,但无论如何,它们显然是错误的方式,因为我问所以我会节省空间。哦,在你考虑否决投票或其他事情之前,至少给我一个解释,然后看看我的问答比,以了解你会帮助那些经常帮助别人的人。我欢迎以学习的名义分一杯羹。

最佳答案

您的问题有点不清楚,但如果您想根据是否有完全匹配来切换某些内容,您将需要使用 ng-show 来控制可见性。

如:https://jsfiddle.net/7by52qhh/1/ 所示

<span ng-show="name.name === search">Exact Match!</span>

当存在完全匹配时,这将出现在名称重复器中。

这当然可以显示其他模型数据,为了清楚起见,我将其保留为一些静态文本。

关于javascript - 根据搜索字符串结果切换模型,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29808183/

相关文章:

javascript - window.localStorage 与 chrome.storage.local

javascript - Angular JS - 如何使用 jqLit​​e 选择给定元素以外的任何内容?

javascript - 如何获取多个选择框值并插入字符串数组

html - 在 Angular js 中,如何在多选中使选定的选项加粗

angularjs-ng-repeat - ng-repeat 内的物化按钮不触发模式

javascript - 具有自定义过滤功能的 AngularJS 多重过滤器

javascript - 关于javascript中的输入名称

javascript - 多个值在 js ajax 中不起作用

javascript - 依赖关系 在 Angular 中将空模块注入(inject)到 Controller 中

angularjs ng 重复表,得到高度错误