Rumah > Artikel > hujung hadapan web > Bagaimana untuk memanggil encodeURIComponent dalam templat AngularJS?
Bagaimana untuk memanggil encodeURIComponent dalam templat AngularJS?
- WBOYke hadapan
- 2023-09-05 16:57:071252semak imbas
Dalam artikel ini, kita akan belajar cara memanggil komponen URI yang dikodkan daripada templat angularjs dalam HTML.
Setiap kali aksara muncul dalam URI, fungsi encodeURIComponent() menggantikannya dengan satu, dua, tiga atau empat jujukan melarikan diri yang mewakili pengekodan UTF-8 aksara tersebut (hanya boleh menjadi empat jujukan melarikan diri aksara yang terdiri daripada dua watak "pengganti").
Tatabahasa
Berikut ialah sintaks encodeURIComponent
encodeURIComponent(uriComponent)
Komponen uri
Sebarang objek, termasuk rentetan, nombor, boolean, batal atau tidak ditentukan. uriComponentTukar kepada rentetan sebelum pengekodan.
Mari kita lihat contoh berikut untuk pemahaman yang lebih baik.
Contoh 1
Dalam contoh di bawah, kami menggunakan komponen 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>
Apabila anda menjalankan skrip di atas, tetingkap output akan muncul menunjukkan URL yang dikodkan bagi URL yang kami gunakan dalam skrip di atas.
Contoh 2
Dalam contoh di bawah, kami menggunakan fungsi encodeURIcomponent(string) untuk mengekod parameter 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>
Apabila skrip dilaksanakan, ia akan menghasilkan output yang terdiri daripada url1 dan url2, yang akan kosong, dan memaparkan butang encodeURL pada halaman web.
Jika pengguna mengklik pada butang encodeURL, url yang diberikan dalam url1 akan dikodkan dan dipaparkan dalam url2.
Atas ialah kandungan terperinci Bagaimana untuk memanggil encodeURIComponent dalam templat AngularJS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!