首页 > 解决方案 > 在 angularjs-gridster 单元格中显示图像

问题描述

这是快照。我在网格单元格中添加图像时遇到问题。我正在使用 AngularJS v1.5.x。

网格的CSS

.showImage {
  display: block;
  background: url("../assets1/images/avatars/profile.jpg");
  background-repeat: no-repeat;
  background-position: center;
}

格子的 HTML

    <div class="columns" ng-style="{height: $ctrl.columnsHeight + 'px'}">
  <div class="column showImage" ng-repeat="column in $ctrl.columns"
       ng-style="{'min-width': $ctrl.width + 'px', 'margin-left': ($first && !$ctrl.gridster.$options.outerMargin ? 0 : $ctrl.margin) + 'px'}">
  </div>
</div>
<div class="rows" ng-style="{width: $ctrl.rowsWidth + 'px'}">
  <div class="row showImage" ng-repeat="row in $ctrl.rows"
       ng-style="{height: $ctrl.height + 'px', 'margin-top': ($first && !$ctrl.gridster.$options.outerMargin ? 0 :$ctrl.margin) + 'px'}">
  </div>
</div>

标签: angularjsimageangularjs-gridster

解决方案


推荐阅读