是否可以更改离子行的顺序？

Question

我正在实现一个响应式网格，就像您在图像中看到的那样：

我知道可以更改Ionic中列的顺序，但是否可以对行进行相同的操作？

例如，当前，行的顺序为红色，黄色和绿色。 我希望大屏幕显示为绿色，红色和黄色。这可能吗？类似于offset-* or push-* and pull-*，但用于行。

还是您会尝试找到一种更好的方法？也许是使用列的另一种结构，我们知道可以对其进行排序。

现在，这是我拥有的代码：

  <ion-grid>
    <ion-row>
      <ion-col col-12>
        <ion-row>
          <ion-col>
            Things inside
          </ion-col>
        </ion-row>

        <ion-row>
          <ion-col>
            Things inside
          </ion-col>
        </ion-row>

        <!-- I want this row to be the first on large screens -->
        <ion-row>
          <ion-col>
            Things inside
          </ion-col>
        </ion-row>
      </ion-col>

      <ion-col col-12>
        Things inside
      </ion-col>
    </ion-row>
  </ion-grid>

Answer 1

• 将每一行内的数据移动到一个 javascript 对象并更改 UI 以实现一个 forEach 以加载所有数据

class ColData: any;
class RowData: ColData[];
class GridData: RowData[];

• 当您需要屏幕尺寸时

window.attachEvent('onresize', function(event) {
  // trigger here
});

改变对象的顺序

PS：你可能需要使用 changedetector