AngularJS Notes - 11 Filters

11 Filters

The name is {{ lastName | uppercase }}

The name is {{ lastName | lowercase }}

The birthday is {{ birthday | date:"MM/dd/yyyy 'at' h:mma" }}

Price: {{ price | currency:"NT$":.0 }}

{{ x.name + ', ' + x.country }}

filter 為 i

{{ x }}

輸入文字做 filter

INPUT FILTER

{{ x }}

點 Name 和 Country 可更變排序

Name	Country
{{x.name}}	{{x.country}}

自訂 filter：偶數字大寫

{{x | myFormat}}

			
				
				
					The name is {{ lastName | uppercase }}
					The name is {{ lastName | lowercase }}
					The birthday is {{ birthday | date:"MM/dd/yyyy 'at' h:mma" }}
				
				
				
					Price: {{ price | currency:"NT$":.0 }}
				
				
				
					
						
						{{ x.name + ', ' + x.country }}
						
					
				
				
				
					filter 為 i
					
						{{ x }}
					
					輸入文字做 filter
					
						
						INPUT FILTER
					
					
						{{ x }}
					
				
				
				點 Name 和 Country 可更變排序
				
					
						
						
							Name
							Country
						
						
						
						
							{{x.name}}
							{{x.country}}
						
						
					
				


				
				自訂 filter：偶數字大寫
				
					
						{{x | myFormat}}

AngularJS 提供以下 filter 做資料轉換：

currency 將數字格式化成貨幣格式　詳細介紹>
date 將日期格式化成指定格式　詳細介紹>
filter 從陣列中選擇物件中的一個集合　詳細介紹>
json 將物件格式化成 JSON 格式　詳細介紹>
limitTo 限制陣列或字串變成元素或字元的指定數字　詳細介紹>
lowercase 將字串格式化成小寫　詳細介紹>
number 將數字格式化成字串　詳細介紹>
orderBy 用表達式排序陣列　詳細介紹>
uppercase 將字串格式化成大寫　詳細介紹>

filter 加入表達式時，要加入「|」字元。