Maison > Article > interface Web > Comment appeler encodeURIComponent dans le modèle AngularJS ?

Comment appeler encodeURIComponent dans le modèle AngularJS ?

WBOYavant: 2023-09-05 16:57:071248parcourir

Dans cet article, nous apprendrons comment appeler un composant URI encodé à partir du modèle angulaire js en HTML.

Chaque fois qu'un caractère apparaît dans un URI, la fonction encodeURIComponent() le remplace par une, deux, trois ou quatre séquences d'échappement représentant l'encodage UTF-8 de ce caractère (il ne peut y avoir que quatre séquences d'échappement de caractères composées de deux caractères "de substitution").

Grammaire

Ce qui suit est la syntaxe de encodeURIComponent

encodeURIComponent(uriComponent)

Composant Uri

Tout objet, y compris une chaîne, un nombre, un booléen, nul ou non défini. uriComponentConvertir en chaîne avant l'encodage.

Regardons l'exemple suivant pour une meilleure compréhension.

Exemple 1

Dans l'exemple ci-dessous, nous utilisons le composant encodeURI

<!DOCTYPE html>
<html>
<body>
   <p id="tutorial"></p>
   <script>
      let uri = "https://www.tutorialspoint.com/index.htm";
      let encoded = encodeURIComponent(uri);
      document.getElementById("tutorial").innerHTML = encoded;
   </script>
</body>
</html>

Lorsque vous exécutez le script ci-dessus, une fenêtre de sortie apparaîtra affichant l'URL codée de l'URL que nous avons utilisée dans le script ci-dessus.

Exemple 2

Dans l'exemple ci-dessous, nous utilisons la fonction encodeURIcomponent(string) pour encoder le paramètre url.

<!DOCTYPE html>
<html>
<head>
   <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.min.js"></script>
   <script>
      var myApp = angular.module("mytutorials", []);
      myApp.controller("mytutorials1", function($scope) {
         $scope.url1 = 'https://www.tutorialspoint.com/index.htm';
         $scope.url2 = '';
         $scope.encodeUrlStr = function() {
            $scope.url2 = encodeURIComponent($scope.url1);
         }
      });
   </script>
</head>
<body>
   <div ng-app="mytutorials">
      <div ng-controller="mytutorials1">
         <button ng-click ="encodeUrlStr()" >Encode URL</button>
         <br>
         URL1 = {{url1}}<br>
         URL2 = {{url2}}
      </div>
   </div>
</body>
</html>

Lorsque le script s'exécutera, il générera une sortie composée de url1 et url2, qui seront vides, et affichera un bouton encodeURL sur la page Web.

Si l'utilisateur clique sur le bouton encodeURL, l'url donnée dans url1 sera codée et affichée dans url2.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration：

Cet article est reproduit dans:. en cas de violation, veuillez contacter admin@php.cn Supprimer

Article précédent：Comment utiliser le type de saisie email en HTML ?Article suivant：Comment utiliser le type de saisie email en HTML ?

Articles Liés

Voir plus