¿Cómo reemplazar una string por otra string en AngularJS?

En este artículo, veremos cómo seleccionar una string del texto y reemplazarla con otra string usando AngularJS y lo entenderemos a través de las ilustraciones. El método replace() se puede usar para buscar los caracteres en particular, que se reemplazan con caracteres específicos y devolver una nueva string generada.

Sintaxis:

string.replace(char findChar, char replacedChar);

Valores paramétricos:

  • findChar: representa el carácter que se va a buscar y reemplazar con el nuevo carácter.
  • replaceChar : Representa el nuevo carácter reemplazado, al reemplazar el findChar, que genera la nueva string.

Valor de retorno: Devuelve la nueva string que contiene los nuevos caracteres que han reemplazado a los caracteres especificados.

Enfoque: el enfoque utiliza el método replace() y reemplaza el contenido de la string con el nuevo. En el primer ejemplo, la string ‘ Bienvenido usuario ‘ se reemplaza por la palabra ‘ Geek ‘ en lugar de ‘ Usuario ‘. En el segundo ejemplo, la palabra ‘ Usuario ‘ se reemplaza por la string que el usuario ingresa en el elemento de entrada.

Ejemplo 1: en este ejemplo, la palabra «Usuario» se reemplaza con la nueva palabra «Geek» usando el método replace() .

HTML

<!DOCTYPE HTML>
<html>
 
<head>
    <script src=
"//ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.min.js">
    </script>
    <script>
        var myApp = angular.module("app", []);
        myApp.controller("controller", function($scope) {
            $scope.str1 = "Welcome User";
            $scope.str2 = "";
            $scope.remSpaces = function() {
                $scope.str2 = $scope.str1.replace("User", "Geek");
            };
        });
    </script>
</head>
 
<body style="text-align:center;">
    <h1 style="color:green;">
        GeeksforGeeks
    </h1>
    <h3> Replace a string by another in AngularJS </h3>
    <div ng-app="app">
        <div ng-controller="controller"> String = '{{str1}}'
            <br><br>
            <button ng-click='remSpaces()'>
                Replace User
            </button>
            <br><br>
             Replaced String = '{{str2}}'
            <br>
        </div>
    </div>
</body>
</html>

Producción:

 

Ejemplo 2: en este ejemplo, el carácter de entrada se reemplaza con el carácter buscado con la ayuda del método replace() .

HTML

<!DOCTYPE HTML>
<html>
 
<head>
    <script src=
"//ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.min.js">
    </script>
    <script>
        var myApp = angular.module("app", []);
        myApp.controller("controller", function($scope) {
            $scope.str1 = "Welcome User";
            $scope.str2 = '';
            $scope.replaceStr = function() {
                 
                // Get & replace the input value
                $scope.str1 =
                      $scope.str1.replace("User", $scope.str2);
            };
        });
    </script>
</head>
 
<body style="text-align:center;">
    <h1 style="color:green;">
        GeeksforGeeks
    </h1>
    <h3>
        Replace a string by
        another in AngularJS
    </h3>
    <div ng-app="app">
        <div ng-controller="controller"> Enter here:
            <input type="text"
                   name="strExample"
                   ng-model="str2">
            <br><br>
            <button ng-click='replaceStr()'>
                 Replace
            </button>
            <br><br>
                String = {{str1}}<br>
        </div>
    </div>
</body>
</html>

Producción:

 

Publicación traducida automáticamente

Artículo escrito por PranchalKatiyar y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

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