角度ソートのコード例-jsチュートリアル-php.cn

ホームページ

ウェブフロントエンド

jsチュートリアル

角度ソートのコード例

零下一度

Jun 28, 2017 am 10:00 AM

angular 選別

角度ソートの小さなケースについて話しましょう

<!DOCTYPE html>
<html ng-app="mk">
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			*{
				margin: 0px;
				padding: 0px;
			}
			nav{
				text-align: center;
			}
			nav>*{
				vertical-align: top;
			}
			table{
				width: 100%;
				text-align: center;
			}
			table th,td{
				background: #A9A9A9;
				line-height: 30px;
			}
		</style>
	</head>
	<body>
		<div ng-controller="text">
			<nav>
				<select ng-model="a"> <!-- 这也是表单也有数据，她可以获取value值，这几个值代表你循环进来的每项key名 -->
					<option value="num">按编号排序</option>
					<option value="name">按姓名排序</option>
					<option value="age">按年龄排序</option>
				</select>
				<select ng-model="b">  <!-- 也同样获取value值，当为负的时候，是倒序，正序 -->
					<option value="">升序</option>
					<option value="-">降序</option>
				</select>
				<input type="text" ng-model="s"/>
			</nav>
			<table border="0px" id="table">
				<tr>
					<th>编号</th>
					<th>姓名</th>
					<th>年龄</th>
				</tr>
				<tr ng-repeat="value in data | orderBy:b+a | filter:s"> <!-- 过滤器过滤以下数据 b+a这样就字符串拼接到了一起。这样数据改变就进行了排序 -->
					<td>{{value.num}}</td>
					<td>{{value.name}}</td>
					<td>{{value.age}}</td>
				</tr>
			</table>
		</div>
		
		
		<script src="js/angular.min.js?1.1.11" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			var app=angular.module("mk",[]);
			app.controller("text",function($scope,$http){
				$http.get("paixu.json").success(function(data){
					$scope.data=data.xinxi
					$scope.a="num";
				})
			});
		</script>
	</body>
</html>

ログイン後にコピー

以上が角度ソートのコード例の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

このウェブサイトの声明

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Video Face Swap

完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

ホットツール

ホットトピック

Java チュートリアル

1662

CakePHP チュートリアル

1419

Laravel チュートリアル

1313

PHP チュートリアル

1262

C# チュートリアル

1235

Related knowledge

Windows 11/10で写真を撮影日ごとに並べ替える方法 Feb 19, 2024 pm 08:45 PM

この記事では、Windows 11/10 で写真を撮影日順に並べ替える方法を紹介し、Windows で写真が日付順に並べ替えられない場合の対処法についても説明します。 Windows システムでは、画像ファイルを見つけやすくするために、写真を適切に整理することが重要です。ユーザーは、日付、サイズ、名前などのさまざまな並べ替え方法に基づいて写真を含むフォルダーを管理できます。さらに、必要に応じて昇順または降順を設定して、ファイルをより柔軟に整理できます。 Windows 11/10 で写真を撮影日で並べ替える方法 Windows で写真を撮影日で並べ替えるには、次の手順に従います。 [ピクチャ]、デスクトップ、または写真を配置する任意のフォルダを開きます。リボンメニューで、

Outlook でメールを送信者、件名、日付、カテゴリ、サイズで並べ替える方法 Feb 19, 2024 am 10:48 AM

Outlook には、作業をより効率的に管理するための多くの設定と機能が用意されています。その 1 つは、ニーズに応じてメールを分類できる並べ替えオプションです。このチュートリアルでは、Outlook の並べ替え機能を使用して、送信者、件名、日付、カテゴリ、サイズなどの基準に基づいてメールを整理する方法を学習します。これにより、重要な情報の処理と検索が容易になり、生産性が向上します。 Microsoft Outlook は、電子メールやカレンダーのスケジュールを簡単に一元管理できる強力なアプリケーションです。電子メールの送受信、整理が簡単にできるほか、内蔵のカレンダー機能により今後のイベントや予定を簡単に追跡できます。 Outlo の使い方

PHP 開発: テーブルデータのソート機能とページング機能を実装する方法 Sep 20, 2023 am 11:28 AM

PHP 開発: テーブルデータのソート機能とページング機能を実装する方法 Web 開発では、大量のデータを処理するのが一般的なタスクです。大量のデータを表示する必要があるテーブルの場合、通常、優れたユーザーエクスペリエンスを提供し、システムパフォーマンスを最適化するために、データの並べ替え機能とページング機能を実装する必要があります。この記事では、PHP を使用してテーブルデータのソート機能とページング機能を実装する方法と、具体的なコード例を紹介します。ソート機能はテーブルにソート機能を実装しており、ユーザーはさまざまなフィールドに従って昇順または降順でソートできます。以下は実装フォームです

Python を使用した XML データのフィルタリングと並べ替え Aug 07, 2023 pm 04:17 PM

Python を使用した XML データのフィルタリングと並べ替えの実装はじめに: XML は、データをタグと属性の形式で保存する、一般的に使用されるデータ交換形式です。 XML データを処理するとき、多くの場合、データのフィルタリングと並べ替えが必要になります。 Python には、XML データを処理するための便利なツールとライブラリが多数用意されています。この記事では、Python を使用して XML データをフィルタリングおよび並べ替える方法を紹介します。 XML ファイルの読み取り始める前に、XML ファイルを読み取る必要があります。 Python には XML 処理ライブラリが多数ありますが、

Ubuntu 24.04 に Angular をインストールする方法 Mar 23, 2024 pm 12:20 PM

Angular.js は、動的アプリケーションを作成するための無料でアクセスできる JavaScript プラットフォームです。 HTML の構文をテンプレート言語として拡張することで、アプリケーションのさまざまな側面を迅速かつ明確に表現できます。 Angular.js は、コードの作成、更新、テストに役立つさまざまなツールを提供します。さらに、ルーティングやフォーム管理などの多くの機能も提供します。このガイドでは、Ubuntu24 に Angular をインストールする方法について説明します。まず、Node.js をインストールする必要があります。 Node.js は、ChromeV8 エンジンに基づく JavaScript 実行環境で、サーバー側で JavaScript コードを実行できます。ウブにいるために

C++ プログラム: 単語の位置をアルファベット順に並べ替えます。 Sep 01, 2023 pm 11:37 PM

この問題では、文字列が入力として与えられ、その文字列に出現する単語を辞書順に並べ替える必要があります。これを行うには、文字列内の各単語 (スペースで区切られている) に 1 から始まるインデックスを割り当て、ソートされたインデックスの形式で出力を取得します。 String={"Hello","World"}"Hello"=1 "World"=2 入力文字列内の単語は辞書編集順であるため、出力には「12」が出力されます。いくつかの入力/結果のシナリオを見てみましょう - 入力文字列内のすべての単語が同じであると仮定して、結果を見てみましょう - 入力:{"hello","hello","hello"}結果:3 取得された結果

Java の Arrays.sort() メソッドはカスタムコンパレータによって配列をどのようにソートしますか? Nov 18, 2023 am 11:36 AM

Java の Arrays.sort() メソッドはカスタムコンパレータによって配列をどのようにソートしますか? Java では、Arrays.sort() メソッドは配列を並べ替えるのに非常に便利なメソッドです。デフォルトでは、このメソッドは昇順で並べ替えます。ただし、場合によっては、独自に定義したルールに従って配列を並べ替える必要があります。このとき、カスタムコンパレータ（Comparator）を使用する必要があります。カスタムコンパレータは、Comparator インターフェイスを実装するクラスです。

Angular と Node を使用したトークンベースの認証 Sep 01, 2023 pm 02:01 PM

認証は、Web アプリケーションの最も重要な部分の 1 つです。このチュートリアルでは、トークンベースの認証システムと、それが従来のログインシステムとどのように異なるかについて説明します。このチュートリアルを終えると、Angular と Node.js で書かれた完全に動作するデモが表示されます。従来の認証システムトークンベースの認証システムに進む前に、従来の認証システムを見てみましょう。ユーザーはログインフォームにユーザー名とパスワードを入力し、[ログイン] をクリックします。リクエストを行った後、データベースにクエリを実行してバックエンドでユーザーを認証します。リクエストが有効な場合、データベースから取得したユーザー情報を使用してセッションが作成され、セッション情報が応答ヘッダーで返され、セッション ID がブラウザに保存されます。対象となるアプリケーションへのアクセスを提供します。

See all articles

角度ソートのコード例

ホットAIツール

Undresser.AI Undress

AI Clothes Remover

Undress AI Tool

Clothoff.io

Video Face Swap

人気の記事

ホットツール

メモ帳++7.3.1

SublimeText3 中国語版

ゼンドスタジオ 13.0.1

ドリームウィーバー CS6

SublimeText3 Mac版

ホットトピック