Угловой атрибут для потока HTML - PullRequest
Новая
       19

Угловой атрибут для потока HTML

0 голосов
/ 22 мая 2019

Я пытаюсь добавить видео из потока cloudflare на мой сайт.Код, который дает cloudflare, запускается в формате html, но когда я вставляю код в html-компонент моего углового проекта.Я получаю сообщение об ошибке -

Ошибка: ошибки синтаксического анализа шаблона: «поток» не является известным элементом: 1. Если «поток» является угловым компонентом, убедитесь, что он является частью этого модуля.,2. Чтобы разрешить любой элемент, добавьте «NO_ERRORS_SCHEMA» к «@ NgModule.schemas» этого компонента.(" [ОШИБКА ->]

Код, работающий в формате html, выглядит следующим образом 

    <stream src="6aaee8579a7a************" autoplay muted preload></stream>
    <script data-cfasync="false" defer="" type="text/javascript" src="https://embed.cloudflarestream.com/embed/r4xu.fla9.latest.js?video=6aaee8579a7a************"></script>

Теперь это действительно POC, и я сам не знаю угловых, простопытаясь научиться. Может ли кто-нибудь, пожалуйста, направить меня на правильный материал, который я должен изучить, чтобы отсортировать это?

1 Ответ

1 голос
/ 22 мая 2019

Вы можете сделать следующие шаги для добавления потока cloudflare в ваш угловой компонент:

1 .Добавьте теги потока к необходимому компоненту.

app.component.html 

<stream src="5d5bc37ffcf54c9b82e996823bffbb81" controls></stream>

2 .Теперь ваш AppModule (при условии, что ваш компонент принадлежит AppModule) должен выглядеть следующим образом:

app.module.ts 

import { NgModule, NO_ERRORS_SCHEMA } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';

import { AppComponent } from './app.component';
import { HelloComponent } from './hello.component';

@NgModule({
  imports:      [ BrowserModule, FormsModule ],
  declarations: [ AppComponent, HelloComponent ],
  schemas: [ NO_ERRORS_SCHEMA ], // <- You need to add this line
  bootstrap:    [ AppComponent ]
})
export class AppModule { }

3 .Теперь добавьте библиотеку javascript cloudflare в вашу index.html

<html>
  <body>
    <my-app>loading</my-app>
  </body>

  <script src="https://embed.cloudflarestream.com/embed/r4xu.fla9.latest.js" id="video_embed" defer="" async=""></script>  
</html>

. Вы можете найти рабочую stackblitz demo здесь

...