Question

我有条件地向诸如此类的元素添加标题属性：

<div #optionEl class="option-title" [attr.title]="isTitleTruncated(optionEl) ? option.title : null">
    {{option.title}}
</div>

调用：

isTitleTruncated(e) {
    return (e.offsetWidth < e.scrollWidth);
}

对于标题确实适用的情况，获取：

Error: ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value: 'title: null'. Current value: 'title: A very long piece of text'

我不确定为什么会这样，有人可以指出原因或可能的原因吗？

Answer 1

当呈现值/绑定初始值/操作到视图属性之前，属性值发生多次更改时，也会发生此错误。

例如：

可以说您有一个标志变量isTitleTruncated，初始值为false，在加载视图时，它将尝试分配值。在执行此绑定分配工作时，如果再次将标志值重新分配给true or false，则这将导致ExpressionChangedAfterItHasBeenCheckedError。

因为，这里的角度是什么？

Angular runs change detection until the model stabilizes, it might run forever. If Angular doesn't run change detection, then the view might not reflect the current state of the model.

有条件地设置元素属性时的ExpressionChangedAfterItHasBeenCheckedError

1 个答案: