【发布时间】：2015-07-01 18:38:20
【问题描述】：
我是 AngularJs 单页应用程序的新手。我的Index.html 是这样的：
<!DOCTYPE html>
<html data-ng-app="myApp">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
<script type="text/javascript">
//<![CDATA[
try {
if (!window.CloudFlare) {
var CloudFlare = [{ verbose: 0, p: 0, byc: 0, owlid: "cf", bag2: 1, mirage2: 0, oracle: 0, paths: { cloudflare: "/cdn-cgi/nexp/dok3v=1613a3a185/" }, atok: "2b55dd8c7c971ab3d718db0d970118f3", petok: "d2738f68916396140e27f216b4dbe11ae7687d05-1435074757-1800", zone: "templatecycle.com", rocket: "0", apps: {} }];
CloudFlare.push({ "apps": { "ape": "130be1e7f8d852544c2ef22b01b98e71" } });
!function (a, b) { a = document.createElement("script"), b = document.getElementsByTagName("script")[0], a.async = !0, a.src = "//ajax.cloudflare.com/cdn-cgi/nexp/dok3v=7e13c32551/cloudflare.min.js", b.parentNode.insertBefore(a, b) }()
}
} catch (e) {
};
//]]>
</script>
<script>
paceOptions = {
elements: true
};
</script>
</head>
<body>
<div data-ng-view></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script src="assets/js/owl.carousel.min.js"></script>
<script src="assets/bootstrap/js/bootstrap.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular-route.min.js"></script>
</body>
</html>
在这个index.html 页面中，我正在加载anguluarjs 部分视图：
page1.html：
<div class="inner-box relative">
<h2 class="title-2">
Featured Listings
<a id="nextItem" class="link pull-right carousel-nav"> <i class="icon-right-open-big"></i></a>
<a id="prevItem" class="link pull-right carousel-nav"> <i class="icon-left-open-big"></i> </a>
</h2>
<div class="row">
<div class="col-lg-12">
<div class="no-margin item-carousel owl-carousel owl-theme">
<div class="item">
<a href="ads-details.html">
<span class="item-carousel-thumb">
<img class="img-responsive" src="../../images/item/tp/Image00011.jpg" alt="img">
</span>
<span class="item-name"> Lorem ipsum dolor sit amet </span>
<span class="price"> $ 260 </span>
</a>
</div>
<div class="item">
<a href="ads-details.html">
<span class="item-carousel-thumb">
<img class="item-img" src="../../images/item/tp/Image00006.jpg" alt="img">
</span>
<span class="item-name"> consectetuer adipiscing elit </span>
<span class="price"> $ 240 </span>
</a>
</div>
</div>
</div>
</div>
</div>
在部分视图（普通 HTML）之外，它工作正常，
但在局部视图中，它如下所示：
您能指导我吗，我在这里缺少什么重要的东西？
【问题讨论】：
-
你能添加初始化轮播的JS部分吗？控制台有 JS 错误吗？
-
@peppeocchi 不，我没有向 init carousal 添加任何 JS 代码。不，没有控制台错误。
-
尝试手动初始化轮播，在局部视图内部，或在局部视图加载后在控制器内部
标签： jquery html angularjs single-page-application owl-carousel