angular – 警告:SafeValue必须使用[property] = binding

前端之家收集整理的这篇文章主要介绍了angular – 警告:SafeValue必须使用[property] = binding前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我试图以这种方式将元素getBoundingClientRect()发送到我的组件:

<object [fromTop]="element.getBoundingClientRect().top"></object>

在我的组件html中我这样做,因为我得到一个说明它“不安全”

this.fromTop = this.sanitizer.bypassSecurityTrustStyle(this.fromTop);

<div
style="position:absolute;top:{{fromTop}}px;">Top:{{fromTop}}</div>

添加消毒剂后,我收到以下消息:

SafeValue must use [property]=binding:

怎么了?如何让我的对象处于一个绝对位置,等于顶部:{{fromTop}} px?

解决方法

{{}}仅用于字符串绑定.已清理的值不再是普通字符串,如果使用{{}},则会删除清理标记.

您需要清理整个样式值,然后将其绑定到[style] =“…”

但更有棱角的方式是使用Angular绑定或指令

<div [style.top.px]="fromTop" [style.position]="'absolute'">Top:{{fromTop}}</div>

<div [ngStyle]="{top: fromTop + 'px',position: 'absolute'}">Top:{{fromTop}}</div>

这样就不需要消毒.

猜你在找的Angularjs相关文章