Выберите категории, отображаемые на домашней странице геосети
На домашней странице geonetwork 3.6 я хочу выбрать, какие категории метаданных будут отображаться. Geonetwork использует фасетный поиск с AngularJs (с которым я не знаком), чтобы выбрать категорию для отображения. По умолчанию отображаются все доступные категории.
Код выглядит так:
<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>
Вместо того, чтобы иметь все категории, мне нужно выбрать только несколько из них. Я попытался отфильтровать, изменив элемент ng-repeat, как:
<span data-ng-repeat="(key, facet) in searchInfo.facet['category'] == 'some_category'"
Но результатов нет. Есть ли способ легко выбрать, какие элементы отображаются?
2 ответа
AngularJS имеет синтаксис фильтра для ngRepeat
:
<span data-ng-repeat="(key, facet) in searchInfo.facet['category'] | filter:'some_category'" ...>
Если вы хотите фильтровать более чем по одной строке, вероятно, лучше использовать функцию предиката:
<span data-ng-repeat="(key, facet) in searchInfo.facet['category'] | filter:catSubset" ...>
Определите функцию предиката в вашем контроллере:
$scope.catSubset = function(value, index, array) {
if(value == "some_category" || value == "some_other_category") {
return true;
}
}
Это не поддерживается Internet Explorer (без полизаполнения), но его легче читать / писать:
var selectedCategories = [
"some_category",
"some_other_category"
];
$scope.catSubset = function(value, index, array) {
if(selectedCategories.includes(value)) {
return true;
}
}
Поскольку количество нужных мне категорий весьма ограничено, я изменил стратегию и прописал ее вместо использования параметров фильтра. Не эффективное решение, если нужно много категорий, но для моего случая это приемлемо. Я закодировал это так:
<div class="col-sm-12 col-md-12" data-ng-show="browse !== ''"> <!-- set width of facet box on main page -->
<h3>
<div class="row"> <!-- box containing the different topics -->
<!-- First category -->
<div class="col-xs-12 col-sm-6 col-md-4 chips-card text-center">
<a href="#/search?facet.q=keyword%2FMarine Spatial Plan%26type%2Fdataset&resultType=details">
<img class="img-thumbnail" src="http://localhost:8080/geonetwork/images/harvesting/belgica-image.jpeg" alt="thumbnail image"></img>
<p>Marine Spatial Plan</p>
</a>
</div>
<!-- Second category -->
<div
class="col-xs-12 col-sm-6 col-md-4 chips-card text-center">
<a href="#/search?facet.q=keyword%2FMarine Strategy Framework Directive%26type%2Fdataset&resultType=details">
<img class="img-thumbnail" src="http://localhost:8080/geonetwork/images/harvesting/MSFD-logo.jpeg" alt="thumbnail image"></img>
<p class="text-center">Marine Strategy Framework Directive</p>
</a>
</div>
и так далее.