对下拉列表进行排序

Question

当用户使用单选按钮选择他想要的排序类型时，我在对下拉列表进行排序时遇到问题。如果他选择上升，则列表将从最低数字到最高数字排序。如果他选择后代，那么这将是从最高到最低的数字。这是我的代码<div *ngIf="!estNom" id="choix" class="row">    <h1 class="col-12"> Les Citoyens </h1>    <section class="col-12">        <h2>Sélection Par NAS:</h2>               <select (change)="surSelection($event.target.value)">            <option selected disabled hidden>Choisissez:</option>            <option *ngFor="let cito of citoyens" [value]="cito.id">{{cito.id}} : {{cito.nom}}</option>        </select>        <button (click)="activerSelectionNom()"> Trier Par Nom </button>        <section >            <input type="radio" id="Ascendant" name="radio1" value="Ascen">            <label for="Ascen">Ascendant</label><br>            <input type="radio" id="Descendant" name="radio2" value="Descen">            <label for="Descen">Descendant</label>        </section>               </section>   </div>

Answer 1

在radio值改变事件的回调函数中调用该函数。

function sortCitoyens(citoyens, isAsc) {

    if(isAsc){

        citoyens.sort((a,b)=>a.id-b.id)

    }else{

        citoyens.sort((a,b)=>b.id-a.id)

    }

}

Answer 2

有人发布了答案，然后将其删除，但我有时间这样做并且它有效，所以谢谢大家的帮助:)

 <section class="col-12">

        <h2>Sélection Par Nom:</h2>

            <select (change)="surSelection($event.target.value)">

                <option value="" selected disabled hidden>Choisissez:</option>

                <option *ngFor="let cito of citoyens.sort()" [value]="cito.id">{{cito.nom}} : {{cito.id}}</option>

    

            </select>

            <button (click)="activerSelectionNAS()"> Trier Par NAS </button>

    

            <section>

    

               

                <input type="radio" id="asc" name="sort" (click)="sort('asc')"> &nbsp;

                <label for="asc">Ascendant</label><br>

                <input type="radio" id="desc" name="sort" (click)="sort('desc')" > &nbsp;

                <label for="desc">Descendant</label>

                

            </section>

           

    </section>

sort(type: string) {

  const sortList = (a: any, b: any) => a.nom.toLowerCase().localeCompare(b.nom.toLowerCase());

  this.citoyens = type === "asc"

    ? this.citoyens.sort((a: any, b: any) => sortList(a, b))

    : this.citoyens.sort((a: any, b: any) => sortList(b, a));

}