Html 角度：如果为空，则在DOM中不显示任何内容

如果一个数组的元素与另一个数组的元素匹配，我将删除该数组的元素。我在这里遇到了一个问题，当我试图用HTML打印这个新修改的数组时，它不会为那个特定的索引打印任何内容，但会占用该行。如果数组有空/未定义的值，我希望它不要占用select的任何一行。我该怎么做？我尝试了一些事情，但找不到任何帮助

代码如下：

TS

for（var i=0；i

HTML

选择子管理权限：
{{saData}}

如评论中所述，您不能对此使用“删除”，而是拼接项目或其他筛选。根据您提供的代码，下面的过滤器应该可以工作

    const filteredData = subAdminAllData.filter(data => !subAdminData.some((data2) => data2.roles === data));

使用此代码，您应该只在subAdminData数组中保留不是“角色”属性的subAdminAllData元素。

如果您在项目中使用lodash，您可以使用.difference或.pullAll

---

否则，请使用数组。splice而不是delete，因为“delete”会删除值，但在数组中留下一个“空白点”-这可能会导致您的问题

您使用错误的方法从数组中删除项目。您需要将

删除此.subadmin数据[j]

更改为

此.subadmin数据.splice（j，1）

。有什么区别吗？使用

dellte（）

方法只需将该元素更改为

未定义的
。有几种方法可以从数组中完全删除项
Pop（）
，
shift（）
，
splice（）
和
filter
。
<div class="input-group">
      <div class="input-group-addon">
        <select class="custom-select" size = "5" name= "subadminrights" required style = "width: 100%;">
          <option selected disabled value = "Select admin rights">Select sub administrative rights: </option>
          <option value="full" *ngFor = "let saData of subAdminAllData">
            
            {{saData}}</option>
            <!-- occupies a row with nothing in it if the array index has null value -->

        </select>
      </div>
    </div>

    const filteredData = subAdminAllData.filter(data => !subAdminData.some((data2) => data2.roles === data));