Nota: Para verificar a versão do seu Angular CLI digite: ng --version  

O comando : npm install -g @angular/cli   instala o Angular CLI.

Na pasta src temos a pasta app onde estão os componentes da aplicação

O arquivo tsconfig.json é o arquivo de configuração TypeScript;

Um componente é um recurso utilizado para criar uma classe responsável por controlar e manter o estado de uma view.

O arquivo app.component.html é onde vamos exibir a nossa aplicação.

O arquivo app.module.ts contém a classe AppModule é responsável por expor para a aplicação algum código específico, que pode ser uma classe, uma função, ou mesmo uma constante.

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { NgxPaginationModule } from 'ngx-pagination';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    NgxPaginationModule,
    AppRoutingModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'Paginação Angular 7';

  public dadosAlunos=[];
  pag : Number = 1 ;
  contador : Number = 5;

  constructor() {
    console.log('Aplicação iniciada, Carregando dados...');

    this.dadosAlunos = [
      { 'id': 1, 'nome': 'Clare Cornau', 'fone': '(815) 6180492', 'email': 'ccornau0@bigcartel.com', 'sexo': 'Feminino', 'pais': 'Somalia' },
      { 'id': 2, 'nome': 'Edouard Elsmore', 'fone': '(507) 3119958', 'email': 'eelsmore1@goo.gl', 'sexo': 'Masculino', 'pais': 'United States' },
      { 'id': 3, 'nome': 'Aeriel Elldred', 'fone': '(478) 7181722', 'email': 'aelldred2@archive.org', 'sexo': 'Feminino', 'pais': 'Russia' },
      { 'id': 4, 'nome': 'Yan Chi Mung', 'fone': '(698) 4411762', 'email': 'ameachem3@columbia.edu', 'sexo': 'Feminino', 'pais': 'China' },
      { 'id': 5, 'nome': 'Jeremiah Hadwen', 'fone': '(345) 6582965', 'email': 'jhadwen4@contakte.ru', 'sexo': 'Masculino', 'pais': 'Mongolia' },
      { 'id': 6, 'nome': 'Romilada Andrade', 'fone': '(659) 9557733', 'email': 'romildandr@times.com', 'sexo': 'Masculino', 'pais': 'Belgica' },
      { 'id': 7, 'nome': 'Ramirez Gonzales', 'fone': '(864) 2101861', 'email': 'ramgonz@yellowbook.com', 'sexo': 'Masculino', 'pais': 'Peru' },
      { 'id': 8, 'nome': 'Jayme Crotty', 'fone': '(165) 5814372', 'email': 'jcrotty7@opensource.org', 'sexo': 'Masculino', 'pais': 'Niger' },
      { 'id': 9, 'nome': 'Margo Braker', 'fone': '(428) 2282928', 'email': 'mbraker8@yahoo.co.jp', 'sexo': 'Feminino', 'pais': 'Argentina' },
      { 'id': 10, 'nome': 'Bernardo Guzman', 'fone': '(673) 5170425', 'email': 'bernardguz@google.com', 'sexo': 'Feminino', 'pais': 'Uruguai' },
      { 'id': 11, 'nome': 'Darelle Rowlands', 'fone': '(978) 8885907', 'email': 'drowland@slate.com', 'sexo': 'Feminino', 'pais': 'Indonesia' },
      { 'id': 12, 'nome': 'Neile Keets', 'fone': '(956) 9360112', 'email': 'nkeetsb@canalblog.com', 'sexo': 'Feminino', 'pais': 'Finlandia' },
      { 'id': 13, 'nome': 'Sonia Buarque', 'fone': '(055) 7150720', 'email': 'soniabuarque@so-net.net', 'sexo': 'Feminino', 'pais': 'Brasil' },
      { 'id': 14, 'nome': 'Ana Maria Rocha', 'fone': '(055) 4076124', 'email': 'anamaria@com.com', 'sexo': 'Masculino', 'pais': 'Brasil' },
      { 'id': 15, 'nome': 'Carola Balasin', 'fone': '(262) 7945277', 'email': 'cbalasine@blogger.com', 'sexo': 'Feminino', 'pais': 'Bolivia' },
      { 'id': 16, 'nome': 'Ming Liu Siang', 'fone': '(501) 3984600', 'email': 'cbarrickf@t-online.de', 'sexo': 'Feminino', 'pais': 'China' },
      { 'id': 17, 'nome': 'Inglis Treweela', 'fone': '(718) 4157883', 'email': 'itreweelag@tripod.com', 'sexo': 'Masculino', 'pais': 'Finlandia' },
      { 'id': 18, 'nome': 'Manoel Soares', 'fone': '(213) 5730967', 'email': 'manusoares@yahoo.com', 'sexo': 'Masculino', 'pais': 'Portugal' },
      { 'id': 19, 'nome': 'Hestia Palffrey', 'fone': '(349) 6453938', 'email': 'hpalffreyi@nba.com', 'sexo': 'Feminino', 'pais': 'Madagascar' },
      { 'id': 20, 'nome': 'Papoulous Mordon', 'fone': '(474) 3068249', 'email': 'gmordonj@uiuc.edu', 'sexo': 'Feminino', 'pais': 'Grécia' }
    ];

  }
}

<div class="container">
  <h2 class="text-secondary text-center">{{ title }}!</h2>
  <hr /> 
  <div>
    <h4 class="text-info">Alunos</h4>
    <div> </div>
    <table class="table table-bordered">
      <thead>
        <tr>
          <th>Id</th>
          <th>Nome</th>
          <th>Telefone.</th>
          <th>Email</th>
          <th>Sexo</th>
          <th>País</th>
        </tr>
      </thead>
      <tbody>
        <tr *ngFor="let a of dadosAlunos | paginate: { itemsPerPage: contador, currentPage: pag }">
          <td>{{a.id}}</td>
          <td>{{a.nome}}</td>
          <td>{{a.fone}}</td>
          <td>{{a.email}}</td>
          <td>{{a.sexo}}</td>
          <td>{{a.pais}}</td>
        </tr>
      </tbody>
    </table>
  </div> 
  <!--inclindo o controle de paginação.-->
  <div class="text-right">
    <pagination-controls (pageChange)="p = $event"></pagination-controls>
  </div>
</div>

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Paginacao1</title>
  <base href="/">

  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="favicon.ico">
  <link rel="icon" type="image/x-icon" href="favicon.ico">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" 
  integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" 
  crossorigin="anonymous">
</head>
<body>
  <app-root>Carregando...</app-root>
  <script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" 
  crossorigin="anonymous"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" 
  integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
</body>
</html>

th, td {
    text-align: left;
}

Quer migrar para o VB .NET ?

• Veja mais sistemas completos para a plataforma .NET no Super DVD .NET , confira...

• Curso Básico VB .NET - Vídeo Aulas

Quer aprender C# ??

• Chegou o Super DVD C# com exclusivo material de suporte e vídeo aulas com curso básico sobre C#.

• Curso C# Basico - Video Aulas

Quer aprender os conceitos da Programação Orientada a objetos ?

• Curso Fundamentos da Programação Orientada a Objetos com VB .NET

Quer aprender o gerar relatórios com o ReportViewer no VS 2013 ?

•  Curso - Gerando Relatórios com o ReportViewer no VS 2013 - Vídeo Aulas