angularjs视图中的my JS of child temlate未执行_Angularjs

angularjs视图中的my JS of child temlate未执行

angularjs

angularjs视图中的my JS of child temlate未执行,angularjs,Angularjs,我正在尝试在angularjs中的子模板中进行幻灯片放映和旋转，但当它们加载时，它们不起作用。我发现这是因为javascript无法执行，我应该如何解决这个问题 <!doctype html> <html class="no-js" lang="" ng-app="tte" ng-controller="GeneralCtrl"> <head> <meta charset="utf-8"> <meta http-equiv="x-ua

我正在尝试在angularjs中的子模板中进行幻灯片放映和旋转，但当它们加载时，它们不起作用。我发现这是因为javascript无法执行，我应该如何解决这个问题

<!doctype html>
<html class="no-js" lang="" ng-app="tte" ng-controller="GeneralCtrl">
<head>
  <meta charset="utf-8">
  <meta http-equiv="x-ua-compatible" content="ie=edge">
  <title>{{Page.Title}}</title>
  <link rel="stylesheet" href="/media/css/bootstrap.min.css">
  <link rel="stylesheet" href="/media/css/swiper.min.css">
  <link rel="stylesheet" href="/media/css/owl.carousel.css">
  <link href="/media/css/nprogress.css" rel="stylesheet">
  <link rel="stylesheet" href="/media/css/style.css">


  <script type="text/javascript" src="/media/js/angular.js"></script>
  <script type="text/javascript" src="/media/js/ng-device-detector.js"></script>
  <script type="text/javascript" src="/media/js/re-tree.js"></script>
  <script type="text/javascript" src="/media/js/angular-route.js"></script>
  <script type="text/javascript" src="/media/js/angular-md5.js"></script>
  <script type="text/javascript" src="/media/js/angular-cache.js"></script>
  <script src="/media/js/vendor/modernizr-2.8.3.min.js"></script>
  <script type="text/javascript" src="/media/js/app.js"></script

</head>
<body>
<ul  id="menu-main">
  <li class="logged-in"><a href="#" title=""><img src="./media/img/general/profile.png" alt="text" width="75" height="75" id="profileImage" class="img-responsive img-circle center-block"></a></li>
</ul>

<div ng-view></div>

<script src="/media/js/vendor/swiper.min.js"></script>
<script src="/media/js/vendor/owl.carousel.min.js"></script>
<script>
  var swiper = new Swiper('.swiper-container', {
    //pagination: '.swiper-pagination',
    paginationClickable: true,
    nextButton: '.swiper-button-next',
    prevButton: '.swiper-button-prev',
    autoplay: 2500,
    autoplayDisableOnInteraction: false,
    //mousewheelControl: true,
    keyboardControl: true
  });

  $('.owl-carousel').owlCarousel({
    rtl:true,
    loop:false,
    margin:10,
    nav:true,
    dots:false,
    margin:30,
    merge:true,
    slideBy:4,
    responsive:{
      0:{
        items:2
      },
      768:{
        items:3
      },
      992:{
        items:4
      }
    }
  })
  $('.owl-carousel .owl-controls .owl-nav .owl-prev').html('<span class="glyphicon glyphicon-menu-right"></span>');
  $('.owl-carousel .owl-controls .owl-nav .owl-next').html('<span class="glyphicon glyphicon-menu-left"></span>');
</script>
</body>
</html>


{{Page.Title}}
我需要更多的信息。你能把你的代码放入plunker吗？你需要使用指令来初始化那些脚本。由于路由实现和ng视图的原因，他们找不到目标元素，因为它们在运行时不存在。请您进一步指导我好吗？我应该把我的js放在指令的模板中吗？我应该在哪里调用该指令？抱歉，我是angular的新手，我在其他地方看到了这个解决方案，但我没有得到它！！！！
<header id="header">

  <div class="swiper-container rtl">
    <div class="swiper-wrapper">
      <div ng-repeat="Slider in hmc.Sliders" class="swiper-slide" style="background-image:url(/media/img/test.gif)">
        <div class="slide-title">
          <h2>test</h2>
          <h1>test<span>test ttitle</span></h1>
          <a href="#" title="test" class="btn btn-danger btn-lg">test</a> </div>
      </div>
      <!--<div class="swiper-slide" >Slide 2</div>
      <div class="swiper-slide" >Slide 3</div>
      <div class="swiper-slide" >Slide 4</div> -->
    </div>
    <!-- Add Pagination -->
    <!--<div class="swiper-pagination"></div>-->
    <div class="icon-arrow-down" id="swiper-button-down"></div>
    <!-- Add Navigation -->
    <div class="swiper-button-prev"></div>
    <div class="swiper-button-next"></div>
  </div>
</header>