Verwenden Sie untypisierte A-Frame-Komponenten mit Angular 2

Gibt es eine Möglichkeit, eine Bibliothek auf Angular-CLI auszuführen, die keine Typisierung enthält?Verwenden Sie untypisierte A-Frame-Komponenten mit Angular 2

In meinem Fall, ich versuche k-frame zu installieren aframe-template-component zu verwenden und über die documentation, verstehe ich, dass ich eine typings.d.ts-Datei erstellen, es zu benutzen mit Typoskript. Laut this Frage habe ich die verschiedenen Optionen ausprobiert, aber ich bin nicht in der Lage, die Datei zu generieren oder direkt in das Projekt zu importieren.

Ich habe auch dts-gen zu laufen und installieren versucht, aber ich bin immer folgende Fehlermeldung:

Component attempted to register before AFRAME was available

Was bedeutet, dass ich ersten A-Frame registrieren. Da ich seit einiger Zeit feststecke, haben Sie eine Idee, wie Sie das folgende Problem lösen können? Vielen Dank im Voraus für Ihre Antworten!

Quelle

2017-02-16 d_z90

Der Titel „Überprüfen Sie, ob Shader bereits registriert worden ist“ verwirrend. Sie könnten bessere Antworten mit etwas wie "Verwenden Sie nicht typisierte A-Frame-Komponenten mit Angular 2" erhalten. –

Danke für den Tipp Mann! Geschätzt. In Bezug auf die Frage, irgendwelche Ideen, was ich falsch mache? –

Ich kenne mich mit dieser Bibliothek nicht aus, aber der Fehler 'Komponente versuchte sich zu registrieren, bevor AFRAME verfügbar war' ist kein TypeScript-Fehler. Es ist ein Laufzeitfehler, der von der Bibliothek ausgegeben wird. Ich sehe keinen Beweis, dass die Bibliothek überhaupt etwas exportiert (und es gibt keine '" Haupt "-Eigenschaft in der' package.json'). Beachten Sie auch, dass das Beispiel erfordert ('kframe'); '. Ich wäre überhaupt nicht überrascht, wenn Sie Ihre Abhängigkeiten in einer ungültigen Reihenfolge laden. –

Im Moment ist es keine leichte Aufgabe.

Ich habe es mit AngularCli versuchen. Ich habe ein neues Projekt mit ng new erstellt, und ich habe diese Schritte folgen:

ng new kframetest

Installieren aframe und aframe-template-component mit:

npm install aframe aframe-template-component --save

Aufgrund beiden (zone.js und A-Frame) fangen attributeChangedCallback Sie müssen A-Frame vor zone.js laden. Dann (in polyfills.ts Datei) Ich habe hinzugefügt:
```
import 'aframe'; 
import 'aframe-template-component'; 
```
Kurz vor der import 'zone.js/dist/zone';
Erstellen Sie eine einfache Komponente kframe sample als Vorlage.
```
schemas: [CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA] 
```
Führen Sie die Anwendung:
Um Angular können Sie eine CUSTOM_ELEMENTS_SCHEMA und NO_ERRORS_SCHEMA-NgModule mit schemas Eigenschaft hinzufügen, um Angebote HTML-Tags wie <a-entity> analysieren.

Jetzt können Sie sehen, in der Konsole, A-Frame läuft:

Put the A-Frame script tag in the head of the HTML before the scene to ensure everything for A-Frame is properly registered before they are used from HTML.
aframe-master.js:75646 A-Frame Version: 0.5.0 (Date 10-02-2017, Commit #bf8b8f9) 
aframe-master.js:75647 three Version: ^0.83.0 
aframe-master.js:75648 WebVR Polyfill Version: dmarcos/webvr-polyfill#a02a8089b 

Aber das große Problem ist, dass Angular tryes die HTML zu analysieren und er nicht verstehen, die aframe Vorlagensyntax , können Sie diese Fehlermeldungen erhalten:

Unhandled Promise rejection: Template parse errors: Parser Error: Unexpected token # at column 6 in [src: #boxesTemplate] in KFrameTestComponent
</a-assets> 
<a-entity [ERROR ->]template="src: #boxesTemplate" 
      data-box1color="red" data-box2color="green" data-box3color"): [email protected]:12 

Property binding src not used by any directive on an embedded template. Make sure that the property name is spelled correctly and all directives are listed in the @NgModule.declarations .
</a-assets> 

ich habe gesucht, um html ohne angular parse es hinzufügen, aber ich habe nicht gefunden ...

Ich habe versucht, die Vorlage zum Index HTML hinzuzufügen und es scheint zu funktionieren, aber ich verstehe, dass das nicht Ihre gewünschte Situation ist.

Sie können den Code von hier: https://gitlab.com/jros/angularcli-kframe

Quelle

2017-03-02 09:09:42

Danke für Ihre Mühe, Mann! Am Ende habe ich es geschafft, das Template in "index.html" hinzuzufügen, obwohl es die Ladeperformance der Website beeinflusst. –

Ich kannte K-Frame und A-Frame nicht und ich mochte es. Wie auch immer, haben Sie darüber nachgedacht, eine Feature-Anfrage an eckiges Projekt zu stellen? –

Noch nicht Mann, aber ich denke, ich werde an diesem Punkt :) –

Verwenden Sie untypisierte A-Frame-Komponenten mit Angular 2

Antwort

Verwandte Themen