Heim >Web-Frontend >HTML-Tutorial >Wie rufe ich encodeURIComponent in einer AngularJS-Vorlage auf?

Wie rufe ich encodeURIComponent in einer AngularJS-Vorlage auf?

WBOY
WBOYnach vorne
2023-09-05 16:57:071289Durchsuche

Wie rufe ich encodeURIComponent in einer AngularJS-Vorlage auf?

In diesem Artikel erfahren Sie, wie Sie eine codierte URI-Komponente aus der AngularJS-Vorlage in HTML aufrufen.

Immer wenn ein Zeichen in einem URI erscheint, ersetzt die Funktion encodeURIComponent() es durch eine, zwei, drei oder vier Escape-Sequenzen, die die UTF-8-Codierung dieses Zeichens darstellen (es können nur vier Escape-Sequenzen von Zeichen sein, die aus zwei bestehen). „Ersatzzeichen“).

Grammatik

Das Folgende ist die Syntax von encodeURIComponent

encodeURIComponent(uriComponent)

Uri-Komponente

Jedes Objekt, einschließlich Zeichenfolge, Zahl, boolescher Wert, Null oder undefiniert. uriComponentVor dem Codieren in einen String konvertieren.

Schauen wir uns zum besseren Verständnis das folgende Beispiel an.

Beispiel 1

Im folgenden Beispiel verwenden wir die encodeURI-Komponente

<!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>

Wenn Sie das obige Skript ausführen, wird ein Ausgabefenster mit der codierten URL der URL angezeigt, die wir im obigen Skript verwendet haben.

Beispiel 2

Im folgenden Beispiel verwenden wir die Funktion encodeURIcomponent(string), um den URL-Parameter zu kodieren.

<!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>

Wenn das Skript ausgeführt wird, generiert es eine Ausgabe bestehend aus URL1 und URL2, die leer ist, und zeigt eine EncodeURL-Schaltfläche auf der Webseite an.

Wenn der Benutzer auf die Schaltfläche „URL kodieren“ klickt, wird die in URL1 angegebene URL codiert und in URL2 angezeigt.

Das obige ist der detaillierte Inhalt vonWie rufe ich encodeURIComponent in einer AngularJS-Vorlage auf?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Dieser Artikel ist reproduziert unter:tutorialspoint.com. Bei Verstößen wenden Sie sich bitte an admin@php.cn löschen