السلام عليكم ورحمة الله وبركاتة .

المقالة التالية سوف نتحدث عن منصة Angular  , التي لقت رواج كبير من قبل المبرمجين , لما تقدمة من ميزات وسهوله ديناميكي في العمل .

طبعا هي احد منصات TypeScript  , التي تساعدنا في برمجة صفحات الويب  مثل (JavaScript , jQuery ….) ,و الكثير .

الاصدار الحالي هو Angular 4  ,

سوف نتعرف اكثر على محتواها وميزاتها بمثال صغير .

طبعا كما قلنا هي JavaScript Framework   .

يتم تعريفها على النحو التالي , في راس الصفحة يتم اضافة الـــ CDN  , من موقع Angular  .

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>

االخطوة التالية , وهي تعرف الجزء الدي سيعمل على Angular  , على سبيل المثال

<div ng-app="">
   </div>

يجب اضافة ng-app=""  حتى يتم التعرف عليها من قبل Angular     .

يتم اضافة نص , من اجل ادخال الاسم كما التالي :

 <p>Name: <input type="text" ng-model="name"></p>

 مع ذكر  ng-model="name"  , الذي يعتبر كمرجع للقراءه منه في ما بعد .

وايضا يتم اضافة <p> لعرض محتوى صندوق النص name  .

<p ng-bind="name"></p>

يدل الكود السابقة للـ p  على انها تعمل bind  من name  التي هي من نوع Text  .

الكود كامل :

 
<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<body>

<div ng-app="">
  <p>Name: <input type="text" ng-model="name"></p>
  <p ng-bind="name"></p>
</div>

</body>
</html>

 االناتج :

 



Share

Comments