Question

我用一个简单的响应式caroussel创建了一个小例子，按预期工作。

data-reactid

问题是，当我使用角度绑定它时，图像不会显示。

ATTR_NAME

这是我的app.js文件中的代码（轮播在main.html文件中定义）：

<body>

<div class="wrap">
    <header>header</header>
    <div class="main">
        <div class="container fill" style="padding: 0px;">
            <div id="myCarousel" class="carousel slide">
                <div class="carousel-inner">
                    <div class="active item">
                        <div class="fill" style="background-image:url('app/images/image2.jpg');">
                            <div class="container">

                            </div>
                        </div>
                    </div>
                    <div class="item">
                        <div class="fill" style="background-image:url('app/images/image1.jpg');">
                            <div class="container">

                            </div>
                        </div>
                    </div>
                    <div class="item">
                        <div class="fill" style="background-image:url('//placehold.it/1024x700/CC1111/FFF');">
                            <div class="container">

                            </div>
                        </div>
                    </div>
                </div>
                <div class="pull-center">
                    <a class="carousel-control left" href="#myCarousel" data-slide="prev">‹</a>
                    <a class="carousel-control right" href="#myCarousel" data-slide="next">›</a>
                </div>
            </div>
        </div>
    </div>
    <div class="clear"></div>
    <footer>@Copyright</footer>
</div>

我在开发者控制台中没有错误，在网络调用中，调用并找到了图像。这就是我的输出（只有控件可见）：

Answer 1

要使用ngView，您需要设置路由。你没有发布你的任何应用程序JS代码，因此很难看出它可能出错的地方，但通常做我认为你问的方法是：

剪切旋转木马的内容并将其放在单独的.html文件中（称为“部分”）。确保省略页面“骨架”中的页脚和其他元素，并将旋转木马的内容放入部分
将ngRoute添加到您的应用
定义路线（在app.config（）中）。在您的情况下，如果它只是一个页面，您可能会使用RouteProvider上的“.otherwise”函数并将templateUrl设置为您的部分html文件
当路由解析时，partial被加载到ngView（可以是元素或其他元素的属性）

如果没有看到你的代码就很难分辨出你遇到麻烦的地方，但我的猜测是你只是试图在没有路线的情况下使用ngView;容易犯错误。

Answer 2

我终于找到了答案。我必须设置div的高度：

  <div class="main">
      <div ng-view="" style="height:100%"></div>
  </div>

使用ng视图加载的空的caroussel

2 个答案: