Advertisement

Angular2插值表达式的嵌套显示方法是什么

阅读量:
问题描述

Angular项目中添加了一个级联下拉框组件,如下图所示:

这里写图片描述

组件使用ngFor指令遍历Select 同样还有每个Select中的Option。

复制代码
    <option *ngFor="let item of datas[i]" value="{{item.id}}">{{item.name}}</option>

当前面临的问题是:各个下拉列表的数据源字段名称并不一致,在尝试统一所有列表使用 item.name 作为字段名时,则会发现明显无法满足需求。然而若尝试让每个列表根据用户的配置显示不同的字段,则组件将会变得更加灵活。

解决方案
  • 准备一个数组来保存每个下拉列表要显示的字段名称:
复制代码
    dropDownAttributes =["institutionName","majorName"];
  • 首先想到的是直接利用嵌入式插值表达式的嵌套结构来实现每个Select选项项属性的绑定操作。然而,在实际应用中发现Angular环境并不支持嵌套使用的 {{}} 表达式语法。随

全部评论 (0)

还没有任何评论哟~