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="app">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular.min.js"></script>
    <meta charset="UTF-8">
    <title>Refactoring to AngularJS Directive - Demo</title>
  <link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
  <!-- <script src="https://raw.github.com/greengerong/ngmodel-format/master/src/ngmodel.format.js" type="text/javascript"></script> -->
</head>
<body ng-controller="ctr">
<div>
    <form name="form">
        <filedset>
            <legend>
                currency: default config
            </legend>
            <input type="text" ng-model="test" model-format="currency"/>
            <hr/>
            <pre>{{test | json}}</pre>
        </filedset>
        <filedset>
            <legend>
                currency: customer config for formatter
            </legend>
            <input type="text" ng-model="test1" model-format="currency"
                   formatter="formatter($modelValue,$filter,'$0.00');"/>
            <hr/>
            <pre>{{test1 | json}}</pre>
        </filedset>
​
        <filedset>
            <legend>
                currency: customer config for key down
            </legend>
            <input type="text" ng-model="test2" model-format="currency" name="test2"
                   key-down="all($event,$modelValue,$viewValue)"/>
            <hr/>
            <pre>{{test2 | json}}</pre>
        </filedset>
​
        <filedset>
            <legend>
                digit
            </legend>
            <input type="text" ng-model="test3" model-format="digit"
                    />
            <hr/>
            <pre>{{test3 | json}}</pre>
        </filedset>
​
        <filedset>
            <legend>
                int
            </legend>
            <input type="text" ng-model="test4" model-format="int"
                    />
            <hr/>
            <pre>{{test4 | json}}</pre>
        </filedset>
​
        <filedset>
            <legend>
                float
            </legend>
            <input type="text" ng-model="test5" model-format="float"
                    />
            <hr/>
            <pre>{{test5 | json}}</pre>
        </filedset>
​
        <filedset>
            <legend>
                Radio box value to a boolean
            </legend>
            <div><input type="radio" ng-model="testBoolean" model-format="boolean" value="true"/>
                <input type="radio" ng-model="testBoolean" model-format="boolean" value="false"/></div>
            <hr/>
            <pre>{{testBoolean | json}}</pre>
        </filedset>
​
        <filedset>
            <legend>
                Check box value to a Array
            </legend>
            <div><input ng-model="testToArray" type="checkbox" check-box-to-array="1"/>
                <input ng-model="testToArray" type="checkbox" check-box-to-array="2"/></div>
            <hr/>
            <pre>{{testToArray | json}}</pre>
        </filedset>
    </form>
</div>
</body>
</html>
 
​
Output

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

Dismiss x
public
Bin info
greengerongpro
0viewers