Data-src标签在index.html中工作，但在angular视图中不起作用

我对angular和javascript比较陌生，所以如果我听起来很愚蠢，请接受我的道歉。

我正在尝试将一个主题合并到angular。我注意到，如果我将整个代码包含到index.html中，网站可以工作，但是当我将代码转移到控制器并通过<div ui-view></div>调用它们时，渲染的页面会错过一些关键组件。

例如，下面会导致播放标题背景视频:

<img src="img/video_fix.png" alt="" class="header-video--media" data-video-src="video/intro" data-teaser-source="video/intro" data-provider="Vimeo" data-video-width="1920" data-video-height="960">

如果我将它包含在index.html中，它工作得很好。但如果我把它包含在控制器中，它就不会渲染了。

另一个不渲染的代码:

<section class="parallax-window" data-parallax="scroll" data-image-src="img/bg_office.jpg" data-natural-width="1200" data-natural-height="600">

经过搜索，我知道你不能直接在视图中包含jQuery插件，但必须在指令中这样做。然而，我还没有找到任何指南，可以让我了解如何在angular视图中合并jQuery插件。

index.html中包含以下代码:

<script src="js/video_header.js"></script>
<script>
  $(document).ready(function () {
    'use strict';
    HeaderVideo.init({
      container: $('.header-video'),
      header: $('.header-video--media'),
      videoTrigger: $("#video-trigger"),
      autoPlayVideo: true
    });
  });
</script>

下面是video_header.js的代码

var HeaderVideo = function (e, i) {
  var o = {
    container: e(".header-video"),
    header: e(".header-video--media"),
    videoTrigger: e("#video-trigger"),
    videoCloseTrigger: e("#video-close-trigger"),
    teaserVideo: e("#teaser-video"),
    autoPlayVideo: !1
  }, r = function (i) {
    o = e.extend(o, i), t(), d(), a(), o.videoCloseTrigger.hide(), videoDetails.teaser && n(), o.autoPlayVideo && l()
  }, t = function () {
    return videoDetails = {
      id: o.header.attr("data-video-src"),
      teaser: o.header.attr("data-teaser-source"),
      provider: o.header.attr("data-provider").toLowerCase(),
      videoHeight: o.header.attr("data-video-height"),
      videoWidth: o.header.attr("data-video-width")
    }, videoDetails
  }, d = function () {
    o.container.data("aspectRatio", videoDetails.videoHeight / videoDetails.videoWidth), e(window).resize(function () {
      var i = e(window).width(), r = e(window).height();
      o.container.width(i).height(i * o.container.data("aspectRatio")), r < o.container.height() && o.container.width(i).height(r)
    }).trigger("resize")
  }, a = function () {
    o.videoTrigger.on("click", function (e) {
      e.preventDefault(), l(), o.videoCloseTrigger.fadeIn()
    }), o.videoCloseTrigger.on("click", function (e) {
      e.preventDefault(), s()
    })
  }, n = function () {
    if (Modernizr.video && !f()) {
      var e = videoDetails.teaser, i = '<video autoplay="true" loop="loop" muted id="teaser-video" class="teaser-video"><source src="' + e + '.mp4" type="video/mp4"><source src="' + e + '.ogv" type="video/ogg"></video>';
      o.container.append(i)
    }
  }, v = function () {
    if ("youtube" === videoDetails.provider)var e = '<iframe id="video" src="http://www.youtube.com/embed/' + videoDetails.id + '?rel=0&amp;hd=1&autohide=1&showinfo=0&autoplay=1&enablejsapi=1&origin=*" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>'; else if ("vimeo" === videoDetails.provider)var e = '<iframe id="video" src="http://player.vimeo.com/video/' + videoDetails.id + '?title=0&amp;byline=0&amp;portrait=0&amp;color=3d96d2&autoplay=1" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>'; else if ("html5" === videoDetails.provider)var e = '<video autoplay="true" loop="loop" id="video"><source src="' + videoDetails.id + '.mp4" type="video/mp4"><source src="' + videoDetails.id + '.ogv" type="video/ogg"></video>';
    return e
  }, l = function () {
    o.header.hide(), o.container.append(v()), c(), o.teaserVideo.hide()
  }, s = function () {
    e("#video").remove(), o.teaserVideo.fadeIn(), u(), g()
  }, c = function () {
    o.videoTrigger && o.videoTrigger.fadeOut("slow")
  }, u = function () {
    o.videoTrigger && o.videoTrigger.fadeIn("slow")
  }, g = function () {
    o.videoCloseTrigger.hide()
  }, f = function () {
    return e(window).width() < 900 && Modernizr.touch ? !0 : !1
  };
  return {init: r}
}(jQuery, document);