لا يدعم HTML صفحات HTML المضمنة في صفحات HTML. قم بتنفيذ هذه الوظيفة باستخدام الطرق التالية:
1. استخدم Ajax - دع الخادم يتصل بصفحة HTML المقابلة وقم بتعيينه على innerhtml من عنصر التحكم HTML.
2. استخدم تقنيات الخادم من جانب الخادم مثل JSP ، PHP لتضمين صفحات HTML في الصفحات الديناميكية.
باستخدام AngularJS ، يمكننا استخدام التوجيه NG-in-Teb لتضمين صفحة HTML أخرى في صفحة HTML واحدة.
<div ng-app = "" ng-controller = "studentController"> <div ng-include = "'' main.html '"> </viv> <div ng-include = "' 'thinks.html'> </viv>
مثال
tryangularjs.html
<html> <head> <title> يشمل Angular JS </title> <style> Table ، TH ، TD {Border: 1px Solid Gray ؛ حدود الحدود: الانهيار. Padding: 5px ؛} Table Tr: nth-child (Odd) {background-color: #f2f2f2 ؛} tram tr: nth-child (حتى) {background-color: #ffffff ؛} </style> </head> <body> <h2> angularjs sample application </h2> <div ng-app = " ng-include = "'' main.html '"> </viv> <div ng-include = "' 'objects.html'"> </div> </viv> <script> function studentController ($ scope) {$ scope.student = {firstname: "mahesh" ، lastname: "parashar" {name: 'Physics' ، Marks: 70} ، {name: 'Chemistry' ، Marks: 80} ، {name: 'Math' ، Marks: 65} ، {name: 'English' ، marks: 75} ، {name: 'hindi' ، marks: 67}] ، fullname: function () {var vare. studentObject = $ scope.student ؛ إرجاع studentObject.firstName + "" + studentObject.lastname ؛ }} ؛} </script> <script src = "http://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js"> </script> </body> </html>main.html
<Table> <tr> <td> أدخل الاسم الأول: </td> <td> <type type = "text" ng-model = "student.firstName"> </td> </tr> <tr> <td> أدخل الاسم الأخير: </td> <td> </td> <td> {{student.fullname ()}} </td> </tr> </table>الموضوعات
<p> الموضوعات: </p> <tably> <tr> <th> الاسم </th> <th> علامات </th> </tr> <tr ng-repeat = "tourge in student.subjects"> <td>
الإخراج
لتشغيل هذا المثال ، تحتاج إلى نشر textangularjs.html و main.html و theliefs.html على خادم ويب. افتح textangularjs.html في متصفح الويب باستخدام عنوان URL للخادم. انظر النتائج.
ما سبق هو المعلومات المدرجة في AngularJS. سوف نستمر في تنظيم المعرفة ذات الصلة في المستقبل. شكرا لك على دعمك لهذا الموقع!