Comment appeler encodeURIComponent dans le modèle AngularJS ?-tutoriel HTML-php.cn

Comment appeler encodeURIComponent dans le modèle AngularJS ?

WBOY

Libérer： 2023-09-05 16:57:07

avant

1292 Les gens l'ont consulté

Comment appeler encodeURIComponent dans le modèle AngularJS ?

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)

Copier après la connexion

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>

Copier après la connexion

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>

Copier après la connexion

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!