In geonetwork 3.6 home page, I want to select which metadata categories are displayed. Geonetwork uses a facetted search with AngularJs (which I'm not familiar with) to select the category that are displayed. By default, all categories available are shown.
The code looks like:
<div class="row">
<span data-ng-repeat="(key, facet) in searchInfo.facet['category']"
class="col-xs-12 col-sm-6 col-md-4 chips-card">
<a href="#/search?facet.q=category%2F{{facet['@name']}}">
<img class="pull-left img-thumbnail" src="http://localhost:8080/geonetwork/images/harvesting/odnature.png" alt="thumbnail image"></img>
</a>
<a class="pull-left clearfix"
title="{{facet['@label']}}">
<span class="badge-text pull-left">
<span class="gn-icon-label">{{facet['@label']}}</span>
</span>
</a>
</span>
</div>
Instead of having all the categories I need to select only a few of them. I tried to filter by changing the ng-repeat element like:
<span data-ng-repeat="(key, facet) in searchInfo.facet['category'] == 'some_category'"
But no results. Is there a way to easily choose which elements are shown?
AngularJS has a filter syntax for ngRepeat
:
<span data-ng-repeat="(key, facet) in searchInfo.facet['category'] | filter:'some_category'" ...>
If you want to filter by more than one string, it's probably best to use a predicate function:
<span data-ng-repeat="(key, facet) in searchInfo.facet['category'] | filter:catSubset" ...>
Define the predicate function in your controller:
$scope.catSubset = function(value, index, array) {
if(value == "some_category" || value == "some_other_category") {
return true;
}
}
This is not supported by Internet Explorer (without a polyfill), but is easier to read/write:
var selectedCategories = [
"some_category",
"some_other_category"
];
$scope.catSubset = function(value, index, array) {
if(selectedCategories.includes(value)) {
return true;
}
}