Angular在ng-repeat中的搜索不起作用
Angular search within ng-repeat not working
所以我对一些出版物有一个小过滤器,总的来说它工作得很好,但是,我遇到了一个问题,这是子术语过滤器只有当我点击它的父之前才工作,这是我的猜测这是一个范围问题,但我不知道如何修复它,任何帮助都会非常感激。
使用Angular过滤器时,我已经忘记发布完整的代码片段了<div class="row">
<div class="onefourth">
<div class="linklist terms">
<ul>
<li ng-repeat="term in terms">
<div ng-class="{parent: term.parent == null, active: $first }" ng-show="term.parent==null">
<input type="radio" name="terms" id="label_{{$index}}" ng-value="{{term.ID}}" ng-model="$parent.search.terms.categoria_pub.ID">
<label for="label_{{$index}}">{{term.name}}</label>
</div>
<ul>
<li ng-repeat="childTerm in terms">
<div ng-if="childTerm.parent.ID==term.ID">
<input type="radio" name="terms" id="label_{{$index}}" ng-value="{{childTerm.ID}}" ng-model="$parent.search.terms.categoria_pub.ID">
<label for="label_{{$index}}">{{childTerm.name}}</label>
</div>
</li>
</ul>
</li>
</ul>
</div>
</div>
<div class="threefourths">
<div class="row">
<div ng-repeat="file in files | filter:search:strict">
<div class="publication">
<div class="onefourth">
<a ng-href="{{ file.custom_fields.jcf_link[0] }}" target="_blank">
<div class="imgholder">
<img ng-src="{{ file.featured_image.source }}" src="<?php echo get_template_directory_uri(); ?>/img/placeholder_pub.jpg">
</div>
</a>
</div>
<div class="threefourths">
<h4>{{file.title}}</h4>
<div class="content" ng-bind-html="file.content | safeHtml">
</div>
<br>
<a ng-href="{{ file.custom_fields.jcf_link[0] }}" class="title" target="_blank">Descargar Publicación</a>
</div>
</div>
</div>
</div>
</div>
编辑:一些示例数据
[
{
"ID": 19,
"name": "Libros, Monografías y notas técnicas",
"slug": "libros-monografias-notas",
"description": "",
"taxonomy": "categoria_pub",
"parent": {
"ID": 4,
"name": "Documentos ",
"slug": "documentos-",
"description": "",
"taxonomy": "categoria_pub",
"parent": null,
"count": 9,
"link": "http://www.example.com/categoria_pub/documentos-/",
"meta": {
"links": {
"collection": "http://www.example.com/wp-json/taxonomies/categoria_pub/terms",
"self": "http://www.example.com/wp-json/taxonomies/categoria_pub/terms/4"
}
}
},
"count": 5,
"link": "http://www.example.com/categoria_pub/libros-monografias-notas/",
"meta": {
"links": {
"collection": "http://www.example.com/wp-json/taxonomies/categoria_pub/terms",
"self": "http://www.example.com/wp-json/taxonomies/categoria_pub/terms/19"
}
},
"$$hashKey": "object:23"
},
{
"ID": 30,
"name": "Todo",
"slug": "todo",
"description": "",
"taxonomy": "categoria_pub",
"parent": null,
"count": 10,
"link": "http://www.example.com/categoria_pub/todo/",
"meta": {
"links": {
"collection": "http://www.example.com/wp-json/taxonomies/categoria_pub/terms",
"self": "http://www.example.com/wp-json/taxonomies/categoria_pub/terms/30"
}
},
"$$hashKey": "object:24"
},
{
"ID": 4,
"name": "Documentos ",
"slug": "documentos-",
"description": "",
"taxonomy": "categoria_pub",
"parent": null,
"count": 9,
"link": "http://www.example.com/categoria_pub/documentos-/",
"meta": {
"links": {
"collection": "http://www.example.com/wp-json/taxonomies/categoria_pub/terms",
"self": "http://www.example.com/wp-json/taxonomies/categoria_pub/terms/4"
}
},
"$$hashKey": "object:25"
},
{
"ID": 17,
"name": "Breves, Informes de opinión",
"slug": "breves",
"description": "",
"taxonomy": "categoria_pub",
"parent": {
"ID": 4,
"name": "Documentos ",
"slug": "documentos-",
"description": "",
"taxonomy": "categoria_pub",
"parent": null,
"count": 9,
"link": "http://www.example.com/categoria_pub/documentos-/",
"meta": {
"links": {
"collection": "http://www.example.com/wp-json/taxonomies/categoria_pub/terms",
"self": "http://www.example.com/wp-json/taxonomies/categoria_pub/terms/4"
}
}
},
"count": 5,
"link": "http://www.example.com/categoria_pub/breves/",
"meta": {
"links": {
"collection": "http://www.example.com/wp-json/taxonomies/categoria_pub/terms",
"self": "http://www.example.com/wp-json/taxonomies/categoria_pub/terms/17"
}
},
"$$hashKey": "object:26"
},
{
"ID": 20,
"name": "Artículos recomendados",
"slug": "articulos-recomendados",
"description": "",
"taxonomy": "categoria_pub",
"parent": null,
"count": 0,
"link": "http://www.example.com/categoria_pub/articulos-recomendados/",
"meta": {
"links": {
"collection": "http://www.example.com/wp-json/taxonomies/categoria_pub/terms",
"self": "http://www.example.com/wp-json/taxonomies/categoria_pub/terms/20"
}
},
"$$hashKey": "object:27"
},
{
"ID": 15,
"name": "Transcripciones webinars",
"slug": "transcripciones-webinars",
"description": "",
"taxonomy": "categoria_pub",
"parent": {
"ID": 4,
"name": "Documentos ",
"slug": "documentos-",
"description": "",
"taxonomy": "categoria_pub",
"parent": null,
"count": 9,
"link": "http://www.example.com/categoria_pub/documentos-/",
"meta": {
"links": {
"collection": "http://www.example.com/wp-json/taxonomies/categoria_pub/terms",
"self": "http://www.example.com/wp-json/taxonomies/categoria_pub/terms/4"
}
}
},
"count": 0,
"link": "http://www.example.com/categoria_pub/transcripciones-webinars/",
"meta": {
"links": {
"collection": "http://www.example.com/wp-json/taxonomies/categoria_pub/terms",
"self": "http://www.example.com/wp-json/taxonomies/categoria_pub/terms/15"
}
},
"$$hashKey": "object:28"
}
]
编辑:jsfiddle抱歉花了这么长时间
https://jsfiddle.net/785p43cb/22/我已经把你的小提琴分叉并更新了。
https://jsfiddle.net/ignaciovillaverde/5g6weppn/4/它的工作方式有点不同。首先,我在file in files | filter:search
中删除了de strict
comparator,你没有使用它。我还将过滤器分为两种不同的方式,一种使用文本类型输入,另一种使用单选按钮。对于单选按钮,我使用了ng-show="hasSelectedCategory(file.terms.categoria_pub) || !selectedCategory"
。
还注意到,在单选按钮的ng-model
指令,我需要使用ng-model="$parent.selectedCategory"
和ng-model="$parent.$parent.selectedCategory"
。
我还包含了一个函数,用于询问文件是否具有选定的类别。看一看
希望有帮助!
使用AngularJS filters
如何?
请注意,您应该修改customFilter以满足您的需求。
相关文章:
- jQuery Datatables:单个列搜索不起作用
- 搜索按钮谷歌地图在我的vf页面上不起作用
- Angular UI Select2指令搜索功能不起作用
- jQuery .focus() 在 Safari(桌面)的搜索字段中不起作用
- 在js中的表中搜索不起作用
- AngularJS搜索没有'不起作用
- 在引导选择组件中的搜索不起作用,其中数据令牌包含所有数字;4730”;
- JQuery UI 地图搜索不起作用
- 谷歌地图地点搜索框不起作用
- 搜索按钮不起作用
- jQuery搜索和替换不起作用(Wordpress)
- 不区分大小写的字符串搜索不起作用
- 引导表分页和搜索不起作用
- ajax实时建议搜索不起作用
- jQuery mobile折叠列表视图,搜索不起作用
- Angular在ng-repeat中的搜索不起作用
- 实时搜索不起作用
- 选择2 4.0 JSON搜索不起作用
- JS,在数组中搜索不起作用
- 为什么我的即时搜索不起作用