index.html
<html ng-app="app">
<head>
<title>Tester for ngInflection</title>
<link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet">
<style>
.ng-cloak {
display: none !important;
}
</style>
</head>
<body ng-controller="TesterCtl">
<div class="jumbotron">
<div class="container">
<h1>ngInflection</h1>
<h2>set your thing, and watch the magic happen</h2>
<div class="form-group">
<label for="thing">Thing</label>
<input type="text" class="form-control" id="thing" ng-model="thing">
</div>
<div class="form-group">
<label for="thingCount">Thing Count</label>
<input type="number" class="form-control" id="thingCount" ng-model="thingCount">
</div>
</div>
</div>
<div class="container ng-cloak">
<p>You have
<ng-pluralize count="thingCount" when="{
'0': 'no {{thing | pluralize}}',
'1': 'one {{thing | singularize}}',
'other': '{} {{thing | pluralize}}'
}"></ng-pluralize>.</p>
<ul>
<li>The plural of "{{thing}}" is "<code>{{ thing | pluralize }}</code>"</li>
<li>The singular of "{{thing}}" is "<code>{{ thing | singularize }}</code>"</li>
<li>The plural of "{{thing}}" is "<code>{{ thing | inflect:2 }}</code>"</li>
<li>The singular of "{{thing}}" is "<code>{{ thing | inflect:1 }}</code>"</li>
<li>The CamelCase of "{{thing}}" is "<code>{{ thing | camelize }}</code>"</li>
<li>The camelCase of "{{thing}}" is "<code>{{ thing | camelize:true }}</code>"</li>
<li>The underscore of "{{thing}}" is "<code>{{ thing | underscore }}</code>"</li>
<li>The humanize of "{{thing}}" is "<code>{{ thing | humanize }}</code>"</li>
<li>The lowercase humanize of "{{thing}}" is "<code>{{ thing | humanize:true }}</code>"</li>
<li>The capitalize of "{{thing}}" is "<code>{{ thing | capitalize }}</code>"</li>
<li>The dasherize of "{{thing}}" is "<code>{{ thing | dasherize }}</code>"</li>
<li>The titleize of "{{thing}}" is "<code>{{ thing | titleize }}</code>"</li>
<li>The demodulize "{{thing}}" is "<code>{{ thing | demodulize }}</code>"</li>
<li>The tableize "{{thing}}" is "<code>{{ thing | tableize }}</code>"</li>
<li>The classify "{{thing}}" is "<code>{{ thing | classify }}</code>"</li>
<li>The foreign_key "{{thing}}" is "<code>{{ thing | foreign_key }}</code>"</li>
<li>The foreign_key joined-id "{{thing}}" is "<code>{{ thing | foreign_key:true }}</code>"</li>
<li>The ordinalize "{{thing}}" is "<code>{{ thing | ordinalize }}</code>"</li>
</ul>
</div>
</body>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.19/angular.min.js"></script>
<script src="https://cdn.rawgit.com/dreamerslab/node.inflection/master/inflection.min.js"></script>
<script src="dist/ngInflection.js"></script>
<script>
var app = angular.module('app', ['ngInflection']);
app.controller('TesterCtl', function($scope){
$scope.thing = 'person';
$scope.thingCount = 0;
});
</script>
</html>