在较小的屏幕上堆叠表分页元素

Question

在下面的代码段中，您可以看到我当前使用的相关表格分页元素和样式。它看起来我想要它在中等和更大的屏幕尺寸上。问题是在较小的屏幕上，分页元素会流到下一行，而计数会保持向右浮动，如下面的屏幕截图所示。

问题的屏幕截图：

我想在较小的屏幕上发生的事情是它在左侧堆叠（如下图所示）或在屏幕中央。

期望的结果：

代码片段以演示此问题：（点击“整页”并将浏览器窗口调整为500px宽度以查看问题）

.button-group {
  list-style: none;
  margin: 0;
  left: 0;
}
.right {
  float: right !important;
}
ul {
  margin-left: 0 !important;
  line-height: 1.6;
  padding: 0;
  list-style-position: outside;
}
ul.pagination {
  display: block;
  min-height: 1.5rem;
}
ul.pagination li {
  color: #222;
  font-size: 0.875 rem;
  height: 1.5rem;
  margin-left: 0.3125rem;
  display: block;
  float: left;
}
ul.pagination li a {
  border-radius: 5px;
  transition: background-color 300ms ease-out;
  display: block;
  padding: 0.0625rem 0.625rem;
}
ul.pagination li.current a {
  background: #bb1018;
  color: #fff;
  cursor: default;
  font-weight: 700;
}
a {
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
}
.button-group.radius>* {
  display: inline-block;
  border-radius: 0;
}
.button-group.radius>:first-child>.button,
.button-group.radius>:first-child>button {
  border-bottom-left-radius: 5px;
  border-top-left-radius: 5px;
}
.button-group.radius>:last-child>.button,
.button-group.radius>:last-child>button {
  border-bottom-right-radius: 5px;
  border-top-right-radius: 5px;
}
.button-group.radius>*>.button .button-group.radius>*>button {
  border-radius: 0;
}
.button-group.radius>* .button,
.button-group.radius>*>button {
  border-left: 1px solid;
  border-color: rgba(255, 255, 255, .5);
}
.button-group .button {
  border: 0;
  box-shadow: none;
}
.button.small {
  border-width: 2px;
  padding: .375rem .75rem .4375rem;
  font-size: 0.875rem;
}
.button,
button {
  -webkit-appearance: none;
  border-style: solid;
  font-weight: 700;
  line-height: normal;
  margin: 0 0 1.25rem;
  position: relative;
  text-align: center;
  background-color: #bb1018;
  border-color: #bb1018;
  color: #fff;
}
.button {
  cursor: pointer;
  transition: all .1s ease-in-out;
  text-transform: uppercase;
  outline: 0;
  text-shadow: 0 1px 0 rgba(106, 80, 73, .3);
}

<div>
  <div>
    <div class="ng-table-pager">
      <ul class="ng-table-counts button-group radius right">
        <li>
          <button type="button" class="button small active" disabled="disabled"><span>10</span>
          </button>
        </li>
        <li>
          <button type="button" class="button small"><span>25</span>
          </button>
        </li>
        <li>
          <button type="button" class="button small"><span>50</span>
          </button>
        </li>
        <li>
          <button type="button" class="button small"><span>100</span>
          </button>
        </li>
      </ul>
      <ul class="pagination ng-table-pagination">
        <li class="arrow">
          <a href="">«</a>
        </li>
        <li class="current">
          <a href=""><span>1</span></a>
        </li>
        <li>
          <a href=""><span>2</span></a>
        </li>
        <li>
          <a href=""><span>3</span></a>
        </li>
        <li>
          <a href=""><span>4</span></a>
        </li>
        <li>
          <a href=""><span>5</span></a>
        </li>
        <li>
          <a href=""><span>6</span></a>
        </li>
        <li>
          <a href=""><span>7</span></a>
        </li>
        <li>
          <a href="">…</a>
        </li>
        <li>
          <a href=""><span>2234</span></a>
        </li>
        <li class="arrow"><a href="">»</a>
        </li>
      </ul>
    </div>
  </div>
</div>

Answer 1

以下是解决问题的简单方法。

添加

<div style="clear:both"></div>

删除

class Right from Pagination

最终守则

<div ng-table-pagination="params" template-url="templates.pagination" class="ng-scope ng-isolate-scope"><!-- ngInclude: templateUrl --><div ng-include="templateUrl" class="ng-scope">
<div class="ng-table-pager ng-scope">
    <!-- ngIf: params.settings().counts.length --><ul ng-if="params.settings().counts.length" class="ng-table-counts button-group radius ng-scope">
        <!-- ngRepeat: count in params.settings().counts --><li ng-repeat="count in params.settings().counts" class="ng-scope">
            <button type="button" ng-class="{'active':params.count()==count}" ng-click="params.count(count)" class="button small active" ng-disabled="params.count()==count" disabled="disabled"><span ng-bind="count" class="ng-binding">10</span></button>
        </li><!-- end ngRepeat: count in params.settings().counts --><li ng-repeat="count in params.settings().counts" class="ng-scope">
            <button type="button" ng-class="{'active':params.count()==count}" ng-click="params.count(count)" class="button small" ng-disabled="params.count()==count"><span ng-bind="count" class="ng-binding">25</span></button>
        </li><!-- end ngRepeat: count in params.settings().counts --><li ng-repeat="count in params.settings().counts" class="ng-scope">
            <button type="button" ng-class="{'active':params.count()==count}" ng-click="params.count(count)" class="button small" ng-disabled="params.count()==count"><span ng-bind="count" class="ng-binding">50</span></button>
        </li><!-- end ngRepeat: count in params.settings().counts --><li ng-repeat="count in params.settings().counts" class="ng-scope">
            <button type="button" ng-class="{'active':params.count()==count}" ng-click="params.count(count)" class="button small" ng-disabled="params.count()==count"><span ng-bind="count" class="ng-binding">100</span></button>
        </li><!-- end ngRepeat: count in params.settings().counts -->
    </ul><!-- end ngIf: params.settings().counts.length -->
    <div style="clear:both;"></div>
    <ul class="pagination ng-table-pagination">
        <!-- ngRepeat: page in pages --><li ng-class="{'current': !page.active &amp;&amp; !(page.type=='prev' || page.type=='next' || page.type=='more'), 'arrow': page.type=='prev' || page.type=='next'}" ng-repeat="page in pages" ng-switch="page.type" class="ng-scope arrow"><!-- ngSwitchWhen: prev --><a ng-switch-when="prev" ng-click="params.page(page.number)" href="" class="ng-scope">«</a><!-- end ngSwitchWhen: --> <!-- ngSwitchWhen: first --> <!-- ngSwitchWhen: page --> <!-- ngSwitchWhen: more --> <!-- ngSwitchWhen: last --> <!-- ngSwitchWhen: next --></li><!-- end ngRepeat: page in pages --><li ng-class="{'current': !page.active &amp;&amp; !(page.type=='prev' || page.type=='next' || page.type=='more'), 'arrow': page.type=='prev' || page.type=='next'}" ng-repeat="page in pages" ng-switch="page.type" class="ng-scope current"><!-- ngSwitchWhen: prev --> <!-- ngSwitchWhen: first --><a ng-switch-when="first" ng-click="params.page(page.number)" href="" class="ng-scope"><span ng-bind="page.number" class="ng-binding">1</span></a><!-- end ngSwitchWhen: --> <!-- ngSwitchWhen: page --> <!-- ngSwitchWhen: more --> <!-- ngSwitchWhen: last --> <!-- ngSwitchWhen: next --></li><!-- end ngRepeat: page in pages --><li ng-class="{'current': !page.active &amp;&amp; !(page.type=='prev' || page.type=='next' || page.type=='more'), 'arrow': page.type=='prev' || page.type=='next'}" ng-repeat="page in pages" ng-switch="page.type" class="ng-scope"><!-- ngSwitchWhen: prev --> <!-- ngSwitchWhen: first --> <!-- ngSwitchWhen: page --><a ng-switch-when="page" ng-click="params.page(page.number)" href="" class="ng-scope"><span ng-bind="page.number" class="ng-binding">2</span></a><!-- end ngSwitchWhen: --> <!-- ngSwitchWhen: more --> <!-- ngSwitchWhen: last --> <!-- ngSwitchWhen: next --></li><!-- end ngRepeat: page in pages --><li ng-class="{'current': !page.active &amp;&amp; !(page.type=='prev' || page.type=='next' || page.type=='more'), 'arrow': page.type=='prev' || page.type=='next'}" ng-repeat="page in pages" ng-switch="page.type" class="ng-scope"><!-- ngSwitchWhen: prev --> <!-- ngSwitchWhen: first --> <!-- ngSwitchWhen: page --><a ng-switch-when="page" ng-click="params.page(page.number)" href="" class="ng-scope"><span ng-bind="page.number" class="ng-binding">3</span></a><!-- end ngSwitchWhen: --> <!-- ngSwitchWhen: more --> <!-- ngSwitchWhen: last --> <!-- ngSwitchWhen: next --></li><!-- end ngRepeat: page in pages --><li ng-class="{'current': !page.active &amp;&amp; !(page.type=='prev' || page.type=='next' || page.type=='more'), 'arrow': page.type=='prev' || page.type=='next'}" ng-repeat="page in pages" ng-switch="page.type" class="ng-scope"><!-- ngSwitchWhen: prev --> <!-- ngSwitchWhen: first --> <!-- ngSwitchWhen: page --><a ng-switch-when="page" ng-click="params.page(page.number)" href="" class="ng-scope"><span ng-bind="page.number" class="ng-binding">4</span></a><!-- end ngSwitchWhen: --> <!-- ngSwitchWhen: more --> <!-- ngSwitchWhen: last --> <!-- ngSwitchWhen: next --></li><!-- end ngRepeat: page in pages --><li ng-class="{'current': !page.active &amp;&amp; !(page.type=='prev' || page.type=='next' || page.type=='more'), 'arrow': page.type=='prev' || page.type=='next'}" ng-repeat="page in pages" ng-switch="page.type" class="ng-scope"><!-- ngSwitchWhen: prev --> <!-- ngSwitchWhen: first --> <!-- ngSwitchWhen: page --><a ng-switch-when="page" ng-click="params.page(page.number)" href="" class="ng-scope"><span ng-bind="page.number" class="ng-binding">5</span></a><!-- end ngSwitchWhen: --> <!-- ngSwitchWhen: more --> <!-- ngSwitchWhen: last --> <!-- ngSwitchWhen: next --></li><!-- end ngRepeat: page in pages --><li ng-class="{'current': !page.active &amp;&amp; !(page.type=='prev' || page.type=='next' || page.type=='more'), 'arrow': page.type=='prev' || page.type=='next'}" ng-repeat="page in pages" ng-switch="page.type" class="ng-scope"><!-- ngSwitchWhen: prev --> <!-- ngSwitchWhen: first --> <!-- ngSwitchWhen: page --><a ng-switch-when="page" ng-click="params.page(page.number)" href="" class="ng-scope"><span ng-bind="page.number" class="ng-binding">6</span></a><!-- end ngSwitchWhen: --> <!-- ngSwitchWhen: more --> <!-- ngSwitchWhen: last --> <!-- ngSwitchWhen: next --></li><!-- end ngRepeat: page in pages --><li ng-class="{'current': !page.active &amp;&amp; !(page.type=='prev' || page.type=='next' || page.type=='more'), 'arrow': page.type=='prev' || page.type=='next'}" ng-repeat="page in pages" ng-switch="page.type" class="ng-scope"><!-- ngSwitchWhen: prev --> <!-- ngSwitchWhen: first --> <!-- ngSwitchWhen: page --><a ng-switch-when="page" ng-click="params.page(page.number)" href="" class="ng-scope"><span ng-bind="page.number" class="ng-binding">7</span></a><!-- end ngSwitchWhen: --> <!-- ngSwitchWhen: more --> <!-- ngSwitchWhen: last --> <!-- ngSwitchWhen: next --></li><!-- end ngRepeat: page in pages --><li ng-class="{'current': !page.active &amp;&amp; !(page.type=='prev' || page.type=='next' || page.type=='more'), 'arrow': page.type=='prev' || page.type=='next'}" ng-repeat="page in pages" ng-switch="page.type" class="ng-scope"><!-- ngSwitchWhen: prev --> <!-- ngSwitchWhen: first --> <!-- ngSwitchWhen: page --> <!-- ngSwitchWhen: more --><a ng-switch-when="more" ng-click="params.page(page.number)" href="" class="ng-scope">…</a><!-- end ngSwitchWhen: --> <!-- ngSwitchWhen: last --> <!-- ngSwitchWhen: next --></li><!-- end ngRepeat: page in pages --><li ng-class="{'current': !page.active &amp;&amp; !(page.type=='prev' || page.type=='next' || page.type=='more'), 'arrow': page.type=='prev' || page.type=='next'}" ng-repeat="page in pages" ng-switch="page.type" class="ng-scope"><!-- ngSwitchWhen: prev --> <!-- ngSwitchWhen: first --> <!-- ngSwitchWhen: page --> <!-- ngSwitchWhen: more --> <!-- ngSwitchWhen: last --><a ng-switch-when="last" ng-click="params.page(page.number)" href="" class="ng-scope"><span ng-bind="page.number" class="ng-binding">2234</span></a><!-- end ngSwitchWhen: --> <!-- ngSwitchWhen: next --></li><!-- end ngRepeat: page in pages --><li ng-class="{'current': !page.active &amp;&amp; !(page.type=='prev' || page.type=='next' || page.type=='more'), 'arrow': page.type=='prev' || page.type=='next'}" ng-repeat="page in pages" ng-switch="page.type" class="ng-scope arrow"><!-- ngSwitchWhen: prev --> <!-- ngSwitchWhen: first --> <!-- ngSwitchWhen: page --> <!-- ngSwitchWhen: more --> <!-- ngSwitchWhen: last --> <!-- ngSwitchWhen: next --><a ng-switch-when="next" ng-click="params.page(page.number)" href="" class="ng-scope">»</a><!-- end ngSwitchWhen: --></li><!-- end ngRepeat: page in pages -->
    </ul>
</div>

这是它的Plunker工作 http://plnkr.co/edit/1uZ4QgeyTxrPlnvs15Fk?p=preview

Answer 2

你应该使用clear和float属性，我根据你的需要修改你的代码。

＆＃13;

＆＃13;

.button-group {
  list-style: none;
  margin: 0;
  float: left;
}
.button-group:after {
  clear:both;
  }


ul {
  margin-left: 0 !important;
  line-height: 1.6;
  padding: 0;
  list-style-position: outside;
}
ul.pagination {
  display: block;
  min-height: 1.5rem;
  float: left;
  clear: both;
}

ul.pagination li {
  color: #222;
  font-size: 0.875 rem;
  height: 1.5rem;
  margin-left: 0.3125rem;
  display: block;
  float: left;
}
ul.pagination li a {
  border-radius: 5px;
  transition: background-color 300ms ease-out;
  display: block;
  padding: 0.0625rem 0.625rem;
}
ul.pagination li.current a {
  background: #bb1018;
  color: #fff;
  cursor: default;
  font-weight: 700;
}
a {
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
}
.button-group.radius>* {
  display: inline-block;
  border-radius: 0;
}
.button-group.radius>:first-child>.button,.button-group.radius>:first-child>button {
  border-bottom-left-radius: 5px;
  border-top-left-radius: 5px;
}
.button-group.radius>:last-child>.button, .button-group.radius>:last-child>button {
  border-bottom-right-radius: 5px;
  border-top-right-radius: 5px;
}
.button-group.radius>*>.button .button-group.radius>*>button {
  border-radius: 0;
}
.button-group.radius>* .button, .button-group.radius>*>button {
  border-left: 1px solid;
  border-color: rgba(255,255,255,.5);
}
.button-group .button {
  border: 0;
  box-shadow: none;
}
.button.small {
  border-width: 2px;
  padding: .375rem .75rem .4375rem;
  font-size: 0.875rem;
}

.button {
  -webkit-appearance: none;
  border-style: solid;
  font-weight: 700;
  line-height: normal;
  position: relative;
  text-align: center;
  background-color: #bb1018;
  border-color: #bb1018;
  color: #fff;
}
.button {
  cursor: pointer;
  transition: all .1s ease-in-out;
  text-transform: uppercase;
  outline: 0;
  text-shadow: 0 1px 0 rgba(106, 80, 73, .3);
}

＆＃13;

<div ng-table-pagination="params" template-url="templates.pagination" class="ng-scope ng-isolate-scope"><!-- ngInclude: templateUrl --><div ng-include="templateUrl" class="ng-scope">
    <div class="ng-table-pager ng-scope">
        <!-- ngIf: params.settings().counts.length --><ul ng-if="params.settings().counts.length" class="ng-table-counts button-group radius right ng-scope">
            <!-- ngRepeat: count in params.settings().counts --><li ng-repeat="count in params.settings().counts" class="ng-scope">
                <button type="button" ng-class="{'active':params.count()==count}" ng-click="params.count(count)" class="button small active" ng-disabled="params.count()==count" disabled="disabled"><span ng-bind="count" class="ng-binding">10</span></button>
            </li><!-- end ngRepeat: count in params.settings().counts --><li ng-repeat="count in params.settings().counts" class="ng-scope">
                <button type="button" ng-class="{'active':params.count()==count}" ng-click="params.count(count)" class="button small" ng-disabled="params.count()==count"><span ng-bind="count" class="ng-binding">25</span></button>
            </li><!-- end ngRepeat: count in params.settings().counts --><li ng-repeat="count in params.settings().counts" class="ng-scope">
                <button type="button" ng-class="{'active':params.count()==count}" ng-click="params.count(count)" class="button small" ng-disabled="params.count()==count"><span ng-bind="count" class="ng-binding">50</span></button>
            </li><!-- end ngRepeat: count in params.settings().counts --><li ng-repeat="count in params.settings().counts" class="ng-scope">
                <button type="button" ng-class="{'active':params.count()==count}" ng-click="params.count(count)" class="button small" ng-disabled="params.count()==count"><span ng-bind="count" class="ng-binding">100</span></button>
            </li><!-- end ngRepeat: count in params.settings().counts -->
        </ul><!-- end ngIf: params.settings().counts.length -->
        <ul class="pagination ng-table-pagination">
            <!-- ngRepeat: page in pages --><li ng-class="{'current': !page.active &amp;&amp; !(page.type=='prev' || page.type=='next' || page.type=='more'), 'arrow': page.type=='prev' || page.type=='next'}" ng-repeat="page in pages" ng-switch="page.type" class="ng-scope arrow"><!-- ngSwitchWhen: prev --><a ng-switch-when="prev" ng-click="params.page(page.number)" href="" class="ng-scope">«</a><!-- end ngSwitchWhen: --> <!-- ngSwitchWhen: first --> <!-- ngSwitchWhen: page --> <!-- ngSwitchWhen: more --> <!-- ngSwitchWhen: last --> <!-- ngSwitchWhen: next --></li><!-- end ngRepeat: page in pages --><li ng-class="{'current': !page.active &amp;&amp; !(page.type=='prev' || page.type=='next' || page.type=='more'), 'arrow': page.type=='prev' || page.type=='next'}" ng-repeat="page in pages" ng-switch="page.type" class="ng-scope current"><!-- ngSwitchWhen: prev --> <!-- ngSwitchWhen: first --><a ng-switch-when="first" ng-click="params.page(page.number)" href="" class="ng-scope"><span ng-bind="page.number" class="ng-binding">1</span></a><!-- end ngSwitchWhen: --> <!-- ngSwitchWhen: page --> <!-- ngSwitchWhen: more --> <!-- ngSwitchWhen: last --> <!-- ngSwitchWhen: next --></li><!-- end ngRepeat: page in pages --><li ng-class="{'current': !page.active &amp;&amp; !(page.type=='prev' || page.type=='next' || page.type=='more'), 'arrow': page.type=='prev' || page.type=='next'}" ng-repeat="page in pages" ng-switch="page.type" class="ng-scope"><!-- ngSwitchWhen: prev --> <!-- ngSwitchWhen: first --> <!-- ngSwitchWhen: page --><a ng-switch-when="page" ng-click="params.page(page.number)" href="" class="ng-scope"><span ng-bind="page.number" class="ng-binding">2</span></a><!-- end ngSwitchWhen: --> <!-- ngSwitchWhen: more --> <!-- ngSwitchWhen: last --> <!-- ngSwitchWhen: next --></li><!-- end ngRepeat: page in pages --><li ng-class="{'current': !page.active &amp;&amp; !(page.type=='prev' || page.type=='next' || page.type=='more'), 'arrow': page.type=='prev' || page.type=='next'}" ng-repeat="page in pages" ng-switch="page.type" class="ng-scope"><!-- ngSwitchWhen: prev --> <!-- ngSwitchWhen: first --> <!-- ngSwitchWhen: page --><a ng-switch-when="page" ng-click="params.page(page.number)" href="" class="ng-scope"><span ng-bind="page.number" class="ng-binding">3</span></a><!-- end ngSwitchWhen: --> <!-- ngSwitchWhen: more --> <!-- ngSwitchWhen: last --> <!-- ngSwitchWhen: next --></li><!-- end ngRepeat: page in pages --><li ng-class="{'current': !page.active &amp;&amp; !(page.type=='prev' || page.type=='next' || page.type=='more'), 'arrow': page.type=='prev' || page.type=='next'}" ng-repeat="page in pages" ng-switch="page.type" class="ng-scope"><!-- ngSwitchWhen: prev --> <!-- ngSwitchWhen: first --> <!-- ngSwitchWhen: page --><a ng-switch-when="page" ng-click="params.page(page.number)" href="" class="ng-scope"><span ng-bind="page.number" class="ng-binding">4</span></a><!-- end ngSwitchWhen: --> <!-- ngSwitchWhen: more --> <!-- ngSwitchWhen: last --> <!-- ngSwitchWhen: next --></li><!-- end ngRepeat: page in pages --><li ng-class="{'current': !page.active &amp;&amp; !(page.type=='prev' || page.type=='next' || page.type=='more'), 'arrow': page.type=='prev' || page.type=='next'}" ng-repeat="page in pages" ng-switch="page.type" class="ng-scope"><!-- ngSwitchWhen: prev --> <!-- ngSwitchWhen: first --> <!-- ngSwitchWhen: page --><a ng-switch-when="page" ng-click="params.page(page.number)" href="" class="ng-scope"><span ng-bind="page.number" class="ng-binding">5</span></a><!-- end ngSwitchWhen: --> <!-- ngSwitchWhen: more --> <!-- ngSwitchWhen: last --> <!-- ngSwitchWhen: next --></li><!-- end ngRepeat: page in pages --><li ng-class="{'current': !page.active &amp;&amp; !(page.type=='prev' || page.type=='next' || page.type=='more'), 'arrow': page.type=='prev' || page.type=='next'}" ng-repeat="page in pages" ng-switch="page.type" class="ng-scope"><!-- ngSwitchWhen: prev --> <!-- ngSwitchWhen: first --> <!-- ngSwitchWhen: page --><a ng-switch-when="page" ng-click="params.page(page.number)" href="" class="ng-scope"><span ng-bind="page.number" class="ng-binding">6</span></a><!-- end ngSwitchWhen: --> <!-- ngSwitchWhen: more --> <!-- ngSwitchWhen: last --> <!-- ngSwitchWhen: next --></li><!-- end ngRepeat: page in pages --><li ng-class="{'current': !page.active &amp;&amp; !(page.type=='prev' || page.type=='next' || page.type=='more'), 'arrow': page.type=='prev' || page.type=='next'}" ng-repeat="page in pages" ng-switch="page.type" class="ng-scope"><!-- ngSwitchWhen: prev --> <!-- ngSwitchWhen: first --> <!-- ngSwitchWhen: page --><a ng-switch-when="page" ng-click="params.page(page.number)" href="" class="ng-scope"><span ng-bind="page.number" class="ng-binding">7</span></a><!-- end ngSwitchWhen: --> <!-- ngSwitchWhen: more --> <!-- ngSwitchWhen: last --> <!-- ngSwitchWhen: next --></li><!-- end ngRepeat: page in pages --><li ng-class="{'current': !page.active &amp;&amp; !(page.type=='prev' || page.type=='next' || page.type=='more'), 'arrow': page.type=='prev' || page.type=='next'}" ng-repeat="page in pages" ng-switch="page.type" class="ng-scope"><!-- ngSwitchWhen: prev --> <!-- ngSwitchWhen: first --> <!-- ngSwitchWhen: page --> <!-- ngSwitchWhen: more --><a ng-switch-when="more" ng-click="params.page(page.number)" href="" class="ng-scope">…</a><!-- end ngSwitchWhen: --> <!-- ngSwitchWhen: last --> <!-- ngSwitchWhen: next --></li><!-- end ngRepeat: page in pages --><li ng-class="{'current': !page.active &amp;&amp; !(page.type=='prev' || page.type=='next' || page.type=='more'), 'arrow': page.type=='prev' || page.type=='next'}" ng-repeat="page in pages" ng-switch="page.type" class="ng-scope"><!-- ngSwitchWhen: prev --> <!-- ngSwitchWhen: first --> <!-- ngSwitchWhen: page --> <!-- ngSwitchWhen: more --> <!-- ngSwitchWhen: last --><a ng-switch-when="last" ng-click="params.page(page.number)" href="" class="ng-scope"><span ng-bind="page.number" class="ng-binding">2234</span></a><!-- end ngSwitchWhen: --> <!-- ngSwitchWhen: next --></li><!-- end ngRepeat: page in pages --><li ng-class="{'current': !page.active &amp;&amp; !(page.type=='prev' || page.type=='next' || page.type=='more'), 'arrow': page.type=='prev' || page.type=='next'}" ng-repeat="page in pages" ng-switch="page.type" class="ng-scope arrow"><!-- ngSwitchWhen: prev --> <!-- ngSwitchWhen: first --> <!-- ngSwitchWhen: page --> <!-- ngSwitchWhen: more --> <!-- ngSwitchWhen: last --> <!-- ngSwitchWhen: next --><a ng-switch-when="next" ng-click="params.page(page.number)" href="" class="ng-scope">»</a><!-- end ngSwitchWhen: --></li><!-- end ngRepeat: page in pages -->
        </ul>
    </div>
</div></div>

＆＃13;

＆＃13;

＆＃13;