在本文中，我們將學習如何從 HTML 中的 angularjs 範本呼叫編碼 URI 元件。
每當某個字元出現在URI 中時，encodeURIComponent() 函數就會將其替換為一個、兩個、三個或四個表示該字元的UTF-8 編碼的轉義序列（只能是由兩個「代理」字元組成的字元的四個轉義序列）。
以下是encodeURIComponent的語法
encodeURIComponent(uriComponent)
任何對象，包括字串、數字、布林值、null 或未定義。 uriComponent在編碼之前轉換為字串。
讓我們看一下以下範例以更好地理解。
在下面的範例中，我們使用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>
在執行上述腳本時，會彈出輸出窗口，顯示我們在上述腳本中使用的 URL 的編碼 URL。
在下面的範例中，我們使用函數 encodeURIcomponent(string) 對 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>
當腳本執行時，它將產生由 url1 和 url2 組成的輸出，該輸出為空，並在網頁上顯示一個encodeURL 按鈕。
如果使用者點擊encodeURL按鈕，url1中給出的url將被編碼並顯示在url2中。
以上是如何在AngularJS模板中呼叫encodeURIComponent？的詳細內容。更多資訊請關注PHP中文網其他相關文章！
