Как встроить тег сценария в угловой компонент? - PullRequest
0 голосов
/ 19 февраля 2019

У меня есть этот тег сценария:

<script src='//vizor.io/static/scripts/vizor-360-embed.js' 
        data-vizorurl='//vizor.io/embed/bumblucian/casuta-favorita'></script>

, который разместит на моем сайте 3D-изображение (см. Пример 3D-изображения )

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

Я попытался ответить на этот вопрос Добавление тегов скрипта в шаблон компонента Angular , но я не знаю, как добавить атрибут data-vizorurl к тегу скрипта.

export class PerspectiveImageComponent implements OnInit {

  constructor(private _renderer2: Renderer2, @Inject(DOCUMENT) private _document) {
  }

  public ngOnInit() {

      let s = this._renderer2.createElement('script');
      s.src='//vizor.io/static/scripts/vizor-360-embed.js';

      // I tried like this, but is not compiling. 
      s.data-vizorurl='//vizor.io/embed/bumblucian/casuta-favorita'; 

      this._renderer2.appendChild(this._document.body, s);
  }
}

Можете ли вы помочь мне с решением?

Редактировать: если я использую s.dataset.vizorurl работает.У меня есть тег сценария на документе, но у меня есть другая ошибка:

vizor-360-embed.js:28 Uncaught TypeError: Cannot read property 'previousElementSibling' of null
    at findSelfInDocument (vizor-360-embed.js:28)
    at vizor-360-embed.js:34
    at vizor-360-embed.js:98

Ответы [ 2 ]

0 голосов
/ 19 февраля 2019

На данный момент я использую трюк для показа этих 3D-изображений, я помещаю тег сценария в div в Index.html и переключаю видимость div с помощью этой функции:

toggleElement(){
  var el=  document.getElementById("3dImage");

    if (el.style.display === "none") {
      el.style.display = "block";
    } else {
      el.style.display = "none";
    }
  } 

Iвсе еще получают некоторые предупреждения:

Запуск приложения "PlayerRenderer" с appParams: {"initialProps": {"file": {"scenes": [{"type": "scene", "uid": "HnWHDuk8CCCX", "children": [], "props": {"title": "IMG 0094 IMG 0175 27 imag", "originalTitle": "IMG 0094 IMG 0175 27 imag", "background": "/ data/image/09a7c800ceea1d084aa480b0ab34902011ad7e20.jpg","thumbnail":"/data/image/09a7c800ceea1d084aa480b0ab34902011ad7e20-thumbnail.jpg"}}]}},"rootTag":1}. DEV === false, предупреждение на уровне разработки отключено, оптимизация производительности включена

Если кто-нибудь найдет решение встроить тег vizor.io script в угловой компонент,Я все еще заинтересован.

0 голосов
/ 19 февраля 2019

Попробуйте это:

...
s.dataset.vizorurl='//vizor.io/embed/bumblucian/casuta-favorita';
...
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...