Angular Mat表格是一个强大的组件，它提供了许多功能，包括分页和页面索引。在使用Mat表格进行分页时，通常需要结合Http请求来获取数据。下面是一个示例解决方法，包含了代码示例。

首先，您需要安装Angular Material库。您可以使用以下命令进行安装：

npm install @angular/material @angular/cdk

接下来，您需要在您的Angular项目中导入和配置Angular Material模块。在您的app.module.ts文件中添加以下代码：

import { MatPaginatorModule } from '@angular/material/paginator';
import { MatTableModule } from '@angular/material/table';

@NgModule({
  imports: [
    ...
    MatPaginatorModule,
    MatTableModule
  ],
  ...
})
export class AppModule { }

在您的组件中，您需要定义一个Mat表格和一个Mat分页器。在您的组件的HTML文件中添加以下代码：

在您的组件的TypeScript文件中，您需要定义表格的数据源和分页器的配置。在您的组件的类中添加以下代码：

import { Component, OnInit, ViewChild } from '@angular/core';
import { MatPaginator } from '@angular/material/paginator';
import { MatTableDataSource } from '@angular/material/table';

@Component({
  ...
})
export class YourComponent implements OnInit {
  // 定义表格的列和数据
  displayedColumns: string[] = ['column1', 'column2', 'column3'];
  dataSource = new MatTableDataSource([]);

  // 获取Mat分页器
  @ViewChild(MatPaginator, { static: true }) paginator: MatPaginator;

  ngOnInit() {
    // 设置表格的数据源
    this.dataSource.paginator = this.paginator;

    // 通过Http请求获取数据
    this.getDataFromServer().subscribe(data => {
      this.dataSource.data = data;
    });
  }

  getDataFromServer(): Observable {
    // 发起Http请求获取数据，这里使用一个假数据源
    return of([
      { column1: 'data1', column2: 'data2', column3: 'data3' },
      { column1: 'data4', column2: 'data5', column3: 'data6' },
      ...
    ]);
  }
}

在以上示例中，我们定义了一个Mat表格和一个Mat分页器。我们使用MatPaginator的@ViewChild装饰器来获取分页器实例，并将其与数据源关联。我们通过发起Http请求获取数据，并将数据赋值给数据源。

请注意，以上示例中的数据源是一个Observable对象。您可以根据实际情况使用不同的数据源，包括从服务器获取数据。

希望以上示例能够帮助您解决Angular Mat表格分页页面索引与Http请求的问题。