Angular 2
Verwenden Sie in Angular 2 native Webkomponenten

AngularJS CSS firebase HTML ionic2 ionic-framework JavaScript jQuery Node.js TypeScript

Bemerkungen

Wenn Sie eine Webkomponente in Ihrer Angular 2-Vorlage verwenden, versucht Angular, eine Komponente mit einem Selektor zu finden, der mit dem benutzerdefinierten Tag der Webkomponente übereinstimmt - was natürlich keinen Fehler verursachen kann und wird.

Die Lösung besteht darin, ein "benutzerdefiniertes Elementeschema" in das Modul zu importieren, das die Komponente enthält. Dies bewirkt, dass angle alle benutzerdefinierten Tags akzeptiert, die nicht mit den Auswahlelementen für ng-Komponenten übereinstimmen.

Fügen Sie dem Modul benutzerdefinierte Elemente hinzu

import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { CommonModule } from '@angular/common';
import { AboutComponent } from './about.component';

@NgModule({
    imports: [ CommonModule ],
    declarations: [ AboutComponent ],
    exports: [ AboutComponent ],
    schemas: [ CUSTOM_ELEMENTS_SCHEMA ]
})

export class AboutModule { }

Verwenden Sie Ihre Webkomponente in einer Vorlage

import { Component } from '@angular/core';

@Component({
  selector: 'myapp-about',
  template: `<my-webcomponent></my-webcomponent>`
})
export class AboutComponent { }

Modified text is an extract of the original Stack Overflow Documentation

Lizenziert unter CC BY-SA 3.0

Nicht angeschlossen an Stack Overflow