Capitalize the first letter of string in AngularJs
use this capitalize filter
var app = angular.module('app', []);app.controller('Ctrl', function ($scope) { $scope.msg = 'hello, world.';});app.filter('capitalize', function() { return function(input) { return (angular.isString(input) && input.length > 0) ? input.charAt(0).toUpperCase() + input.substr(1).toLowerCase() : input; }});<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script><div ng-app="app"> <div ng-controller="Ctrl"> <p><b>My Text:</b> {{msg | capitalize}}</p> </div></div>
I'd say don't use angular/js as you can simply use css instead:
In your css, add the class:
.capitalize { text-transform: capitalize;}Then, simply wrap the expression (for ex) in your html:
<span class="capitalize">{{ uppercase_expression }}</span>No js needed ;)
If you use Bootstrap, you can simply add the text-capitalize helper class:
<p class="text-capitalize">CapiTaliZed text.</p>EDIT: just in case the link dies again:
Text Transform
Transform text in components with text capitalization classes.
lowercased text.
UPPERCASED TEXT.
CapiTaliZed Text.<p class="text-lowercase">Lowercased text.</p><p class="text-uppercase">Uppercased text.</p><p class="text-capitalize">CapiTaliZed text.</p>Note how text-capitalize only changes the first letter of each word, leaving the case of any other letters unaffected.