当我使用ng-include时，Carousel滑块断开

From my main page I include carousel file,

从我的主页我包括轮播文件,

<div data-ng-include="'views/header/template/home_slider.html'"></div>

and home_slider.html contains following code,

和home_slider.html包含以下代码,

<section class="carousel-wrapper" interval="myInterval.value" ng-if="isHome" ng-controller="slideCtrl">
        <div id="carousel-big">
            <div class="item" style="background-image:url(assets/img/slide1.jpg);">
                <div class="caption">

                    <h1>This is where title<br> goes, short or long</h1>
                    <p>by UserX</p>
                    <span>1000 views | 3 weeks ago</span>
                    <button class="btn btn-primary">watch now</button>
                </div>
            </div>
            <div class="item" style="background-image:url(assets/img/slide2.jpg);">
                <div class="caption">
                    <h1>This is where title<br> goes, short or long</h1>
                    <p>by UserX</p>
                    <span>1000 views | 3 weeks ago</span>
                    <button class="btn btn-primary">watch now</button>
                </div>
            </div>
            <div class="item" style="background-image:url(assets/img/slide1.jpg);">
                <div class="caption">
                    <h1>This is where title<br> goes, short or long</h1>
                    <p>by UserX</p>
                    <span>1000 views | 3 weeks ago</span>
                    <button class="btn btn-primary">watch now</button>
                </div>
            </div>
            <div class="item" style="background-image:url(assets/img/slide2.jpg);">
                <div class="caption">
                    <h1>This is where title<br> goes, short or long</h1>
                    <p>by UserX</p>
                    <span>1000 views | 3 weeks ago</span>
                    <button class="btn btn-primary">watch now</button>
                </div>
            </div>
            <div class="item" style="background-image:url(assets/img/slide1.jpg);">
                <div class="caption">
                    <h1>This is where title<br> goes, short or long</h1>
                    <p>by UserX</p>
                    <span>1000 views | 3 weeks ago</span>
                    <button class="btn btn-primary">watch now</button>
                </div>
            </div>
            <div class="item" style="background-image:url(assets/img/slide2.jpg);">
                <div class="caption">
                    <h1>This is where title<br> goes, short or long</h1>
                    <p>by UserX</p>
                    <span>1000 views | 3 weeks ago</span>
                    <button class="btn btn-primary">watch now</button>
                </div>
            </div>
        </div>
    </section>

after adding separate page using ng-include my carousel not working and the page totally break down but If I including those code into my main page then it's working fine. How can I solve It?

使用ng-include添加单独的页面后,我的轮播无法正常工作,页面完全崩溃但如果我将这些代码包含在我的主页面中,那么它的工作正常。我怎么解决呢?

1 个解决方案

#1

You have to write src after ng-include:

你必须在ng-include之后写src:

REPLACE:

<div data-ng-include="'views/header/template/home_slider.html'"></div>

WITH

<div ng-include src="'views/header/template/home_slider.html'"></div>

This will solve the issue. SOURCE

这将解决问题。资源

#1