角按按钮排序

Question

Hey so i'm a beginner trying to understand angularjs/typescript.

I've got an array of fruits written in an unordered list in which i want to sort by descending order and reverse search it in alphabetic order via a button. However I don't know what the function should like... Any help is appriciated

Html:

export class AppComponent {
  fruits: string[] = ["Apple", "Banana", "Orange", "Peach", "Pear", ];
}

<ul>
  <li *ngFor="let fruits of fruits">{{fruits}}
  </li>
</ul>

<button ng-click="send()">Sort </button>

Answer 1

Ok fruits where is?

Anyway:

export class AppComponent {
  cities: string[] = [ "Pear","Banana", "Apple", "Orange", "Peach" ];
}

Ok, now

  <ul>
      <li *ngFor="let city of cities">{{city}}
      </li>
    </ul>

    <button (click)="send()">Sort </button>

And use the function:

send(){
    this.cities = this.cities.sort(); 
}

Answer 2

you can use sort() function.

 send(){
    this.fruits = this.fruits.sort((n1,n2) => {
    if (n1 < n2) {
        return 1;
    }

    if (n1 > n2) {
        return -1;
    }

    return 0;
});
  }

This is the link to your solution. stackBlitz

Answer 3

change the sort() so that it sorts string.

 send(){
     this.fruits.sort((n1,n2) => {
  return n1.localeCompare(n2)  
});

take a look at the stackblitz example, stackblitz link

To toggle, set a variable, check the variable and return the value.

send(){
    this.order = !this.order;
     this.fruits.sort((n1,n2) => {       
      return (this.order)? n1.localeCompare(n2):n2.localeCompare(n1);
    });
  }