angular.js - 각도 테이블의 일련번호를 클릭하면 오름차순, 내림차순 정렬 구현 방법.
PHP中文网
PHP中文网 2017-05-15 17:03:36
0
2
757
으아악 으아악

일련번호를 오름차순, 내림차순으로 클릭하면 어떻게 되나요? 초보자인데 자세한 코드를 알려주세요.

PHP中文网
PHP中文网

认证0级讲师

모든 응답(2)
为情所困

html改下:html改下:

<p ng-app="app" ng-controller="appController">
    <table>
        <thead>
        <tr>
            <th>序号</th>
            <th>内容</th>
            <th>姓名</th>
            <th>地点</th>
            <th>时间</th>
            <th ng-click="toggleSort()">序号</th>
        </tr>
        </thead>
        <tbody>
            <tr ng-repeat="x in obj">
                <td ng-if="$index + 1 === 1" style="color: red">{{$index + 1}}</td>
                <td ng-if="$index + 1 === 2" style="color: green">{{$index + 1}}</td>
                <td ng-if="$index + 1 === 3" style="color: yellow">{{$index + 1}}</td>
                <td ng-if="$index + 1 > 3">{{$index + 1}}</td>
                <td>{{x.Name}}</td>
                <td>{{x.City}}</td>
                <td>{{x.Country}}</td>
                <td>{{x.Country + x.City}}</td>
                <td>{{x.id}}</td>
            </tr>
        </tbody>
    </table>
</p>

js 으아악

js🎜 으아악
習慣沉默

orderBy:'id':desc 필터를 사용하여 정렬이 오름차순인지 내림차순인지 제어할 수 있습니다.
다음 코드는 3-2-1의 순서대로 읽으면 이해하기 쉽습니다.
1 한 번 클릭하면 설명이 변경됩니다

으아악

2 appController에서 desc 초기화 값을 0으로 설정하세요

으아악

3. 필터에 정렬 조건을 추가하세요

으아악
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿