JSFiddle - React, Tailwind, and code Playground

by John Smith

HTML

<script src="angularjs"></script>
<button class="btn btn-primary" (click)="prevPage()">Prev</button>
<button class="btn btn-primary" (click)="prevPage()">Next</button>
{{current.name}}

JavaScript

pages = [
    {name: '../goods', index: 0}, 
    {name: '../incoterm', index: 1}, 
    {name: '../payment-terms', index: 2}
  ];
  current = this.pages[0];
  
  getIndex(currentIndex: number, shift: number){
    const lenght = this.pages.length;
    const incre = (((currentIndex + shift) + lenght) % lenght);
    console.log(incre);
    return incre;
  }

  prevPage() {
    const i = this.getIndex(this.current.index, -1);
    this.current = this.pages[i];
    //this.router.navigate([this.current.name], { relativeTo: this.route });
    console.log(this.current.name);  
  }

  nextPage() {
    const i = this.getIndex(this.current.index, 1);
    this.current = this.pages[i];
    //this.router.navigate([this.current.name], { relativeTo: this.route });
    console.log(this.current.name);   
  }