javascript - 过滤JSON键值并将名称分配给渲染的元素

抱歉，如果这是重复的话，我在任何地方都找不到这种情况。

我有一个ajax调用转到我们的ldap服务器，该服务器返回这样的JSON对象：
{groups: [{dn: "cn=test,ou=security,ou=groups,dc=company,dc=com", isDynamicGroup: true}]
在回应中，这就是我所看到的

{dn: "cn=test,ou=security,ou=groups,dc=company,dc=com",
isDynamicGroup: true}
dn: "cn=test,ou=security,ou=groups,dc=company,dc=com"
isDynamicGroup: true

我能够很好地填充DOM元素并设置前端样式，因此用户可以单击组并加载成员。但是，我想做的是过滤出isDynamicGroup: false并为匹配单独ID /类的样式提供样式。主要是为了让用户知道他们无法发送数据。

这是ajax中的群组通话

//Display groups
$(function displayGroupItems() {
  $(document).on('click', '#ldap-tab', function(event) {
    $.ajax({
        url: 'ldap/groups',
        method: 'GET',
        dataType: 'json',
        success: function(data) {
            $.each(data.groups, function(i, dn) {
                $('<li><a id="groupsList" class="panel-block dn-class">' + dn.dn + '</a></li>').appendTo('#groupSearchUl');
            });
        }
    })
  });
});

现在对象渲染

<div class="groupsList">
 <ul class="groupSearchUl">
  <li><a id="groupsList" class="panel-block dn-class">groupName</a>
  </li>
 </ul>
 </div>

我想看看

<div class="groupsList">
 <ul class="groupSearchUl">
  <li><a id="groupsList dynamicgroup" class="panel-block dn-
   class">groupName</a>
  </li>
 </ul>
 </div>

最佳答案

要过滤掉isDynamicGroup设置为false的组，可以使用：

var dynamicGroups = data.groups.filter(group => group.isDynamicGroup);

如果您只想将一个类仅分配给isDynamicGroup属性设置为true的组，则可以使用以下方法：

$(function displayGroupItems() {
    $(document).on('click', '#ldap-tab', function(event) {
        $.ajax({
            url: 'ldap/groups',
            method: 'GET',
            dataType: 'json',
            success: function(data) {
                data.groups.forEach(function(group) {
                    var groupClass = "groupsList panel-block dn-class";
                    if (group.isDynamicGroup) {
                        groupClass += " dynamic-group";
                    }
                    $('<li><a class="' + groupClass + '">' + group.dn + '</a></li>').appendTo('#groupSearchUl');
                 });
            })
       });
 });