<body ng-app="pluralizeExample">
<div ng-controller="ExampleController">
<label>Person 1:<input type="text" ng-model="person1" value="Igor" /></label><br/>
<label>Person 2:<input type="text" ng-model="person2" value="Misko" /></label><br/>
<label>Number of People:<input type="text" ng-model="personCount" value="1" /></label><br/>
<!--- Example with simple pluralization rules for en locale --->
Without Offset:
<ng-pluralize count="personCount"
when="{'0': 'Nobody is viewing.',
'one': '1 person is viewing.',
'other': '{} people are viewing.'}">
</ng-pluralize><br>
<!--- Example with offset --->
With Offset(2):
<ng-pluralize count="personCount" offset=2
when="{'0': 'Nobody is viewing.',
'1': '{{person1}} is viewing.',
'2': '{{person1}} and {{person2}} are viewing.',
'one': '{{person1}}, {{person2}} and one other person are viewing.',
'other': '{{person1}}, {{person2}} and {} other people are viewing.'}">
</ng-pluralize>
</div>
</body>angular.module('pluralizeExample', [])
.controller('ExampleController', ['$scope', function($scope) {
$scope.person1 = 'Igor';
$scope.person2 = 'Misko';
$scope.personCount = 1;
}]);
External CSS
This Pen doesn't use any external CSS resources.