گروه مقاله : جاوا اسكريپت Java Script
تاريخ انتشار : 1396/05/31 - 11:58
كد :7804
در این مقاله نحوه خواندن فایل های موجود روی سرور و فایل های روی سرور های خارجی را توسط آنگولار آموزش میدهیم.
با آنگولار شما میتوانید اطلاعات یک فایل Html خارجی را درون فایل خود قرار دهید.
دستور العمل Angular
برای خواندن اطلاعات درون یک فایل HTML میتوانید از دستورالعمل ng-include استفاده کنید:
مثال:
<body ng-app="">
<div ng-include="'myFile.htm'"></div>
</body>
مشاهده نتیجه
افزودن کدهای انگولار به دستورالعمل Include
فایل HTML که با دستور العمل ng-include فراخوانی میشود، میتواند دارای کد های AngularJS باشد.
myTable.htm :
<table>
<tr ng-repeat="x in names">
<td>{{ x.Name }}</td>
<td>{{ x.Country }}</td>
</tr>
</table>
فایل myTable.htm دارای کد های مرتبط با آنگولار است و این کد ها براحتی توسط دستورالعمل Include پردازش خواهند شد.
مثال:
<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.php").then(function (response) {
$scope.names = response.data.records;
});
});
</script>
مشاهده نتیجه
دریافت محتوای فایل از یک سایت دیگر
بطور پیشفرض دستورالعمل ng-include بشما اجازه استفاده از محتویات سایت های دیگر را نمی دهد.
برای اینکه بتوانید از یک فایل خارجی محتوا دریافت کنید. باید از whitelist استفاده کنید تا سایت های مجاز را مشخص کنید.
مثال:
<body ng-app="myApp">
<div ng-include="'https://tryit.w3schools.com/angular_include.php'"></div>
<script>
var app = angular.module('myApp', [])
app.config(function($sceDelegateProvider) {
$sceDelegateProvider.resourceUrlWhitelist([
'https://tryit.w3schools.com/**'
]);
});
</script>
</body>
مشاهده نتیجه
براي بهره مندي از مشاوره تخصصي در زمینه طراحی سایت در کرج با شرکت سارگون تماس بگيريد