Saltar al contenido

Poner en mayúscula la primera letra de la cadena en AngularJs

Solución:

utilizar este filtro de mayúsculas

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>

Yo diría que no use angular / js ya que simplemente puede usar css en su lugar:

En su css, agregue la clase:

.capitalize {
   text-transform: capitalize;
}

Luego, simplemente envuelva la expresión (por ejemplo) en su html:

<span class="capitalize">{{ uppercase_expression }}</span>

No se necesitan js;)

Si usa Bootstrap, simplemente puede agregar el text-capitalize clase de ayudante:

<p class="text-capitalize">CapiTaliZed text.</p>

EDITAR: en caso de que el enlace muera de nuevo:

Transformación de texto

Transforme texto en componentes con clases de mayúsculas de texto.

texto en minúsculas.
TEXTO EN MAYÚSCULAS.
Texto en mayúscula.

<p class="text-lowercase">Lowercased text.</p>
<p class="text-uppercase">Uppercased text.</p>
<p class="text-capitalize">CapiTaliZed text.</p>

Tenga en cuenta que el uso de mayúsculas solo cambia la primera letra de cada palabra, sin afectar el caso de las demás letras.

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *