MDB Popover无法显示ng-template内容仅输出模板名称字符串
问题原因
代码中使用mdbPopover="popTemplate"的静态属性赋值写法时,Angular会将双引号包裹的popTemplate识别为普通字符串,不会关联到页面中通过#popTemplate定义的ng-template模板引用,因此弹窗不会渲染自定义HTML内容,仅直接展示字符串文本。
问题表现如下图:
解决方法
将静态属性赋值改为Angular动态属性绑定语法,给mdbPopover属性添加方括号,直接传入模板引用变量,无需给变量加引号。
修正后的代码:
<a role="button"> <ng-template #popTemplate> <div class="md-form"> <textarea type="text" id="form7" class="md-textarea md-textarea-auto form-control" mdbInput style="padding-top: 0;"> </textarea> <label for="form7">Kommentar</label> </div> </ng-template> <i [mdbPopover]="popTemplate" placement="right" mdbPopoverHeader="Dismissible popover" triggers="focus" class="far fa-comment fa-sm"> </i> </a>
注意:若修改后仍存在组件不生效的情况,请确认项目中已正确导入MDB Popover对应的依赖模块。
内容的提问来源于stack exchange,提问作者BennoDual
相关产品推荐
相关产品推荐

