KitCat
KitCat

Reputation: 243

Angular 2 - scripts that require elements

I get an error when I try to use scripted A-Frame elements in my component rather than index.html. The commented section works when running simply index.html.

  <script src="https://aframe.io/releases/0.3.2/aframe.js"></script>
<!--
  <a-scene>
  </a-scene>
-->

However when I send the 'a-scene' element into my component it doesn't work.

@Component({
  selector: 'app-test0',
  template: `
    <a-scene>
    </a-scene>
  `,
  styles: []
})

I get thiss error in the console.

"1. If 'a-scene' is an Angular component, then verify that it is part of this module."

"2. If 'a-scene' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schemas' of this component to suppress this message."

Upvotes: 2

Views: 153

Answers (1)

KitCat
KitCat

Reputation: 243

I was able to get it (somewhat) working. I am getting an error with A-Frame VR but that seems to be out of scope of this problem. I was able to fix the problem by "app.module.ts" file.

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

to

import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';

and

@NgModule({
  declarations: [
    AppComponent,
    Test0Component
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})

to

@NgModule({
  declarations: [
    AppComponent,
    Test0Component
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule
  ],
  providers: [],
  bootstrap: [AppComponent],
  schemas: [ CUSTOM_ELEMENTS_SCHEMA ]
})

Upvotes: 1

Related Questions