অ্যাঙুলারজেএস ইনক্লুড - AngularJS Include
AngularJS এর মাধ্যমে আপনি খুব সহজেই এক্সটার্নাল ফাইলকে এইচটিএমএলে সংযুক্ত করতে পারেন।
AngularJS Include
AngularJS এর মাধ্যমে ng-include ডিরেক্টিভ ব্যবহার করে, আপনি এইচটিএমএল কন্টেন্ট সংযুক্ত করতে পারেন।
উদাহরণ
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.6.5/angular.min.js"></script>
<title>AngularJS উদাহরণ</title>
</head>
<body ng-app="">
<div ng-include="'myFile.htm'"></div>
</body>
</html>
AngularJS কোড সংযুক্ত করা
ng-include ডিরেক্টিভ ব্যবহার করে, AngularJS কোডও সংযুক্ত করতে পারেনঃ
myTable.php:
<table>
<tr ng-repeat="a in names">
<td>{{ a.Name }}</td>
<td>{{ a.Country }}</td>
</tr>
</table>
উপরের "myTable.php" ফাইলটি আপনার ওয়েব পেজে সংযুক্ত করুন, AngularJS কোড গুলো এক্সটার্নাল ফাইলে থাকা সত্ত্বেও দেখবেন সবগুলো কোডই সম্পাদিত(executed) হচ্ছেঃ
উদাহরণ
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.6.5/angular.min.js"></script>
<title>AngularJS উদাহরণ</title>
</head>
<body>
<div ng-app="myApp" ng-controller="customersCtrl">
<div ng-include="'myTable.htm'"></div>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('customersCtrl', function($scope, $http) {
$http.get("customers.html").then(function (response) {
$scope.names = response.data.records;
});
});
</script>
</body>
</html>
ক্রস ডোমেইন(Cross Domain) সংযুক্ত করা
ডিফল্টভাবে ng-include ডিরেক্টিভ অন্য ডোমেইন থেকে ফাইল সংযুক্ত করতে অনুমতি দেয় না,
অন্য ডোমেইন থেকে ফাইল সংযুক্ত করার জন্য আপনার এপ্লিকেশনের কনফিগারেশন ফাংশনে বৈধ ফাইল এবং ডোমেইনের হোয়াইটলিস্ট(whitelist) যোগ করতে হবেঃ
উদাহরণ
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.6.5/angular.min.js"></script>
</head>
<body ng-app="myApp">
<div ng-include="'http://www.refsnesdata.no/angular_include.asp'"></div>
<script>
var app = angular.module('myApp', [])
app.config(function($sceDelegateProvider) {
$sceDelegateProvider.resourceUrlWhitelist([
'http://www.refsnesdata.no/**'
]);
});
</script>
</body>
</html>
আপনার সার্ভার ক্রস ডোমেইন ফাইল এক্সেস করতে অনুমতি আছে কিনা তা নিশ্চিত হোন।