Question

我从https://angular.io/guide/elements#example-a-popup-service下载了Angular Element演示

并在html中使用自定义元素并给出一条消息，但在控制台中检查错误后它将显示表达式更改。

我刚刚像这样更改了AppComponet html代码


@Component({
  selector: 'app-root',
  template: `
    <input #input value="Message">
    <popup-element [message]="'aa'"></popup-element>
  `,
})
export class AppComponent implements OnInit{

  constructor(injector: Injector, public popup: PopupService) {
    // Convert `PopupComponent` to a custom element.
    const PopupElement = createCustomElement(PopupComponent, {injector});
    // Register the custom element with the browser.
    customElements.define('popup-element', PopupElement);
  }
}

它会在页面中显示“ aa”消息，并且浏览器控制台中存在错误。

ERROR Error: ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value: 'null: undefined'. Current value: 'null: aa'.
    at viewDebugError (core.js:25716)
    at expressionChangedAfterItHasBeenCheckedError (core.js:25693)
    at checkBindingNoChanges (core.js:25868)
    at checkNoChangesNodeInline (core.js:30037)
    at checkNoChangesNode (core.js:30010)
    at debugCheckNoChangesNode (core.js:30917)
    at debugCheckRenderNodeFn (core.js:30849)
    at Object.eval [as updateRenderer] (PopupComponent.html:2)
    at Object.debugUpdateRenderer [as updateRenderer] (core.js:30834)
    at checkNoChangesView (core.js:29845)

我该如何解决这个问题？

更改输入值时，角度元素具有ExpressionChangedAfterItHasBeenCheckedError

0 个答案: