user3362364
user3362364

Reputation: 477

Capitalize title in AngularJS

I'm trying to capitalize the title but it isn't seem to be working. I manage to get the other words using css "capitalize" but can't get my head around to make it work with AngularJS title.

This is the angularJS code:

    <title ng-bind="title"></title>

This is the html output:

    <title ng-bind="title" class="ng-binding">james byrne</title>

I want to capitalize both J as well as B.

Upvotes: 2

Views: 2237

Answers (5)

Vaibhav
Vaibhav

Reputation: 447

I hope it helps :)

 <title ng-bind="title" class="ng-binding" style="text-transform:capitalize">james byrne</title>

<span data-ng-bind="caps" style="text-transform:capitalize">james bond</span>
        <input type="text" data-ng-model="caps"/>

enter image description here

Upvotes: 3

ryeballar
ryeballar

Reputation: 30118

You can solve this by creating by creating a capitalize filter and then use ng-bind along with the text to be filtered.

Demo Code

Demo Page

HTML

<title ng-bind="title | capitalize"></title>

JAVASCRIPT

  .run(function($rootScope) {
    $rootScope.title = 'james byrne';
  })

  .filter('capitalize', function() {
    return function(string) {
      return string.split(' ').map(function(string) {
        string = string.trim();
        return string.charAt(0).toUpperCase() + string.substr(1).toLowerCase();
      }).join(' ');
    };
  });

Upvotes: 2

Shushanth Pallegar
Shushanth Pallegar

Reputation: 2862

you can use custom filter

<title  ng-bind="(title| makeCaps)"></title>


app.filter('makeCaps',function(){

  return function(input){

   var capsInput = input.split(' '),
       newInput = [];

   angular.forEach(capsInput,function(val,index){
    newInput.push(val.substr(0,1).toUpperCase()+val.substr(1));   
  });
    return newInput.join(' ');
  }

});

Upvotes: 1

ngLover
ngLover

Reputation: 4588

you can use simple javaScript to perform this ..

document.title = document.title.toUpperCase();

Upvotes: 0

binariedMe
binariedMe

Reputation: 4329

Write your own custom filter while in filter you can use regex to capitalize each letter as :

var tempArray = $scope.title.match(/ [a-z]/);
for(i = 0, i<tempArray.length, i++)
  {
    tempArray[i] = tempArray[i].slice(1);
    $scope.title.replace(/ [a-z]/, tempArray[i].toUpperCase());
  }

Upvotes: 1

Related Questions