我有一组通过 Angular 作用域从服务器返回的图像,我想为每个 div 包装器设置一个唯一的类名。在 background-image 根据页面布局变化的地方,CSS 也需要响应。例如,如果页面宽度低于 768 像素,背景图像将使用较小的图像尺寸 (ImageMediumUrl),否则它将使用较大的尺寸 (ImageUrl)。
我构造html的代码如下:
<div class="item" data-ng-repeat="image in carousel_images">
<img border="0" src="/Content/img/blank.gif" ng-style="{'background-image':'url({{image.ImageUrl}})'}" />
</div>
目前,背景图像设置为大尺寸,您可以从上面的代码中看出。
我如何为每个 div 包装器动态创建一组响应类名称(Angular 中的媒体查询?)?
最佳答案
也许您需要创建一个检测窗口大小调整的指令,然后根据当前大小/窗口状态重建标记。
这是执行此操作并在绑定(bind)属性上设置“显示模式”的指令示例。
http://www.dnasir.com/2013/10/09/display-mode-detection-for-responsive-websites-using-angularjs/
关于html - Angular JS 的动态响应式类名,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20639882/