AngularJS مقدمة
AngularJS هو إطار JavaScript. يمكن إضافته إلى صفحات HTML عبر علامة <script>.
AngularJS يمتد HTML من خلال التوجيهات وربط البيانات إلى HTML من خلال التعبيرات.
AngularJS هو إطار JavaScript
AngularJS هو إطار JavaScript. إنها مكتبة مكتوبة في JavaScript.
يتم نشر AngularJS كملف JavaScript ويمكن إضافته إلى صفحة الويب من خلال علامات البرنامج النصي:
<script src = "http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"> </script>
فيما يلي كلها لإدخال وظيفة علامة تصفية صفحة AngularJS في هذه المقالة. يرجى الاطلاع على المقدمة التالية لمحتوى المفتاح:
صفحة HTML:
<viv> <viv> فئة الأخبار </div> <button ng-click = "clean ()"> مسح </button> </div> <ion-content scroll = "false"> <ul> <li> <p> البلد والمنطقة: </p> <ul> <li ng-repeat = "montersname في الفئة". ng-click = "onClick (inctionsname.name ، inctionsname.checked)"> <input type = "checkbox" value = "inctionsname.name" ng-checked = "inctionsname.checked"/> <span> {{{stationsname.cn}} </span> </li> </ul> </li> <li> <p> capitals: </p> <ul> <li ng-repeat = "capitalsname في الفئة. ng-click = "onClick (capitalsname.name ، capitalsname.checked)"> <input type = "checkbox" value = "capitalsname.name" ng-checked = "capitalsname.checked"/> <span> {{capitalsname.cn}} </span> </li> </ul> </li> <li> <p> المجال: </p> <ul> <li ng-repeat = "scopesname في الفئة. ng-click = "onClick (scopesname.name ، scopesname.checked)"> <input type = "checkbox" value = "scopesname.name" ng-checked = "scopesname.checked"/> <span> {{scopesname.cn} المعلومات: </p> <ul> <li ng-repeat = "EconomicData in Category.EconomicData" ng-click = "onClick (EconomicData.Name ، EconomicData.checked)"> <input type = "checkbox" value = "EconomicData.Name" ng-checked = "economyData.checked"/> <span> {{economyData.cn}} </span> </li> </ul> </li> <li> <p> بيانات البنك المركزي: </p> <ul> <li ng-repeat = "CentralBank في الفئة. centralbank" ng-click = "onClick (centralbank.name ، centralbank.checked)"> <type type = "checkbox" value = "CentralBank.name" ng-click = "infosref ()"> تأكيد </button>بناء الصفحة:
يتم تقسيمه إلى 5 عناصر رئيسية في المجموع ، ويتم إنشاء علامات التصنيف الصغيرة تحت كل عنصر رئيسي من خلال التكرار NG.
تحليل المتطلبات: ينقر المستخدم على كل علامة مرشح ، ويضيف اسم العلامة المحدد إلى صفيف ، ويرسل الصفيف إلى الخلفية لمبرمجي الخلفية للتصفية.
رمز JS:
// تصنيف بيانات تصفية الأخبار (المحاكاة البيانات) $ scope.category = {المناطق: [{{name: "stions_china" ، cn: "China" ، hected: false} ، {name: "regions_unitedstates" ، cn: LSE} ، {name: "regions_unitedkingdom" ، cn: "uk" ، check: false} ، {name: "regions_eurozone" ، cn: "Europe" ، exced: false} ، {name: "verys_ja PAN "، CN:" Japan "، تم التحقق منه: false} ، {name:" stions_canada "، CN:" Canada "، hected: false} ، {name:" stions_australia "، cn: NS_Switzerland "، CN:" Switzerland "، CN:" Switzerland "، فحص: FALSE} ، {name:" regions_others "، cn:" others "، exced: false}] ، capitals: [{name: XChange "، CN:" Forex "، فحص: false} ، {name:" capitals_stocks "، cn:" Treasury "، exced: false} ، {name:" capitals_commodities "، cn: : false} ، {name: "capitals_bondsbonds" ، cn: "brand" ، check: false}] ، scopes: [{name: "scopes_macroscopic" ، cn: "بشكل عام" ، فحص: false} ، {name: dustrial "، cn:" Industrial "، exced: false} ، {name:" scopes_company "، cn:" Company "، exced: false}] ، EconomyData: [{{{economeddata_yes" ، cn: "econical data" ، check: false}] ، centralbank: [{name: البيانات "، تم التحقق منها: false}]} ؛ samename = الفئة [k] [j] ؛ samename.checked = true ؛ إرجاع samename}}}} ؛ لـ (var i = 0 ؛ i <item.length ؛ i ++) {var samename = كل قائمة (عنصر [i]) ؛ // لأنه سيتم تنفيذ الطريقة بأكملها مرتين if ($ scope.categories.indexof (samename.name) <0) {$ scope.categories.push (samename.name) ؛}} ؛ تم تحديده ، أضفه إلى الصفيف المراد إقراره) $ scope.onclick = (filteritem ، check) => {var samename = كل قائمة (filterItem) ؛ if (! check) {samename.checked = true ؛ $ scope.categories.push (filteritem) ؛ i = 0 ؛ i <$ scope.categories.length ؛ i ++) {if ($ scope. {$ scope.oncategoryChange () ؛ $ scope.modal.hide () ؛} ؛ // clear $ scope.clean = () => {let che = $ ("المدخلات: تم التحقق منها") ؛ $ scope.categories.length = 0 ؛ che.each (function (k ، filterInput) {filterinput.checked = false ؛}) ؛ $ scope.infosref () ؛}}ما سبق هو الوظيفة الصغيرة لصفحات صفحة AngularJS التي قدمها لك المحرر. آمل أن يكون ذلك مفيدًا لك. إذا كان لديك أي أسئلة ، فيرجى ترك رسالة لي وسوف يرد المحرر إليك في الوقت المناسب. شكرا جزيلا لدعمكم لموقع wulin.com!