Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html ng-app>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular.min.js"></script>
​
<meta charset=utf-8 />
<title>filter</title>
</head>
<body>
 <div ng-controller="myCtrl"> 
  <!-- currency -->
  <h3>currency</h3>
  <input type="number" ng-model="money"> <br>
      預設貨幣格式 ($): {{money | currency}}<br>
      自訂貨幣格式 (USD$): {{money | currency:"USD$"}}<br>
      <!-- 我也可以自訂成我的名字 --><!-- 其他貨幣格式 -->
      自訂貨幣格式 (Anna£): {{money | currency: "&#163;"}}<br><br>
  
  <h3>date</h3>
  <!-- date -->
  <input type="date" ng-model="birth">
  <pre>{{ birth | date }}</pre>
  <pre>{{ birth | date:'yyyy 年 MM 月 dd 日' }}</pre>
  <pre>{{1288323623006 | date:'medium'}}</pre><br>
   
  <!-- json -->
  <h3>json</h3>
  <pre>{{ obj | json }}</pre>
   
  <!-- limitTo -->
  <h3>limitTo</h3>
  <pre> 
  Limit {{numbers}} to: <input type="integer" ng-model="numLimit">
  <p>Output numbers: {{ numbers | limitTo:numLimit }}</p>
  Limit {{letters}} to: <input type="integer" ng-model="letterLimit">
  <p>Output letters: {{ letters | limitTo:letterLimit }}</p>
</pre>
​
  <!-- number -->
  <h3>number</h3>
  <input type="number" ng-model="num">
  <pre >{{ num | number }}</pre >
  <pre >{{ num | number:5 }}</pre >
​
   
  <!-- lowercase -->
  <h3>lowercase</h3>
  <input type="text" ng-model="lower">
  <pre >{{ lower | lowercase }}</pre >
   
  <!-- uppercase -->
  <h3>uppercase</h3>
  <input type="text" ng-model="upper">
  <pre >{{ upper | uppercase }}</pre >
   
   
   
   
 </div>  
</body>
</html>
 
​
 
function myCtrl($scope) {
  
  $scope.money = 1234.56;
  
  $scope.birth = '2013-01-13';
  
  $scope.obj = {
    name: 'Anna', 
    age: 18, 
    hobbies: [ 'eat', 'sleep']
  };
  
  $scope.numbers = [1,2,3,4,5,6,7,8,9];
  $scope.letters = "abcdefghi";
  $scope.numLimit = 3;
  $scope.letterLimit = 3;
  
  $scope.num = 1234.56789;
  
  $scope.lower = 'Anna';
  $scope.upper = 'Anna';
​
}
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
annaismepro
0viewers