TechOverflow Logo
TechOverflow

Wie man Angular Can't bind to 'data-...' since it isn't a known property of ... behebt

English 简体中文 Deutsch

Problem

Beim Kompilieren Ihrer Angular-Anwendung sehen Sie einen Fehler wie diesen:

angular_error_output.txt
✘ [ERROR] NG8002: Can't bind to 'data-sensor' since it isn't a known property of 'div'. [plugin angular-compiler]

    src/app/my-component/my-component.component.html:107:39:
      107 │ ...                <div class="sensor" [data-sensor]="sensor | json">
          ╵                                       ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

  Error occurs in the template of component NoxecoDepolMeasurementDisplayComponent.

    src/app/my-component/my-component.component.ts:31:17:
      31 │     templateUrl: './my-component.component.html',
         ╵                  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

Lösung

Dieser Fehler tritt auf, wenn Sie versuchen, eine Eigenschaft zu binden, die Angular nicht kennt.

Dies ist ein data-...-Attribut, daher muss Angular nicht speziell darüber Bescheid wissen. Um jedoch zu vermeiden, dass die Typprüfung ausgelöst wird, verwenden Sie stattdessen attr.data-sensor:

my-component.component.html
<div class="sensor" [attr.data-sensor]="sensor | json">

Auf diese Weise weiß Angular, dass es sich um eine Attribut-Bindung und nicht um eine Eigenschafts-Bindung handelt.

Check out similar posts by category: Angular, Typescript