选择地理网络主页中显示的类别答案

【问题标题】：Select categories displayed in geonetwork homepage选择地理网络主页中显示的类别
【发布时间】：2019-07-14 06:36:36
【问题描述】：

在 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'"

但没有结果。有没有办法轻松选择要显示的元素？

【问题讨论】：

标签： angularjs categories facet geonetwork

【解决方案1】：

AngularJS 有一个 filter 语法用于 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 不支持（没有 polyfill），但更容易读/写：

var selectedCategories = [
    "some_category", 
    "some_other_category"
];
$scope.catSubset = function(value, index, array) {
  if(selectedCategories.includes(value)) {
    return true;
  }
}

【讨论】：

【解决方案2】：

由于我需要的类别数量非常有限，我更改了策略并对其进行了编码，而不是使用过滤器选项。如果需要许多类别，这不是一个有效的解决方案，但就我而言，这是可以接受的。我是这样编码的：

<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>

等等。

【讨论】：