Jei norite perjungti DOM elementų rodymo būseną, AngularJS 1 tikriausiai naudosite integruotas AngularJS 1 komandas, pvz., ng-show arba ng-hide:
AngularJS 1 pavyzdys:
Angular2 nauja šablono sintaksė leidžia susieti išraiškas su bet kokiomis vietinėmis DOM elementų savybėmis. Ši absoliučiai nuostabi funkcija atveria begales galimybių. Vienas iš jų yra susieti išraišką su vietine paslėpta ypatybe, kuri yra šiek tiek panaši į ng-show, taip pat nustato elementą display: nėra:
[paslėptas] Angular2 pavyzdys (nerekomenduojama):
Iš pirmo žvilgsnio atrodo, kad aukščiau pateiktas pavyzdys yra ng-show AngularJS 1. Tiesą sakant, jie turi! svarbūs skirtumai.
Tiek ng-show, tiek ng-hide kontroliuoja DOM elementų rodymo būseną per CSS klasę, vadinamą ng-hide, kuri tiesiog nustato elementą rodyti: nėra. Svarbiausia yra tai, kad AngularJS 1 buvo įtrauktas į ng-hide klasę! Svarbu, kuris koreguoja klasės prioritetą taip, kad ji galėtų perrašyti elemento rodymo atributo priskyrimą iš kitų stilių.
Grįžtant prie šio pavyzdžio, naršyklė įgyvendina rodymo: jokio stiliaus vietiniame paslėptame atribute. Dauguma naršyklių jo nenaudoja! svarbu pakoreguoti jos prioritetą. Todėl elemento rodymo būsenos valdymas naudojant [hidden]="expression" gali būti lengvai netyčia perrašytas kitais stiliais. Pavyzdžiui: jei aš parašyti tokį stilių šiam elementui kitur, display: flex, tai turi viršenybę prieš gimtąją paslėptą savybę (žr. čia).
Dėl šios priežasties paprastai naudojame *ngIf, kad perjungtume elemento buvimo būseną, kad pasiektume tą patį tikslą:
*ngIf kampo2 pavyzdys (rekomenduojama):
Skirtingai nuo vietinės paslėptos savybės, *ngIf kampinėje2 nėra ribojama stiliaus. Nesvarbu, kokią CSS rašote, ji saugi. Tačiau vis tiek reikia paminėti, kad *ngIf nekontroliuoja elemento rodymo būsenos, bet tiesiogiai pasiekia rodymo ar nerodymo efektą, pridėdamas/pašalindamas elementą iš šablono.
Žinoma, taip pat galite pridėti paslėptą prioritetą prie paslėpto elemento atributo, naudodami visuotinį stilių, pvz., display: none !important, kad pasiektumėte šį efektą. Galite paklausti, kadangi kampinė grupė žino šias problemas, kodėl gi nepridedant globalaus aukščiausio prioriteto paslėpto stiliaus prie paslėpto sistemoje? Atsakymas yra tas, kad negalime garantuoti, kad globalių stilių pridėjimas yra geriausias pasirinkimas visoms programoms. Kadangi šis metodas iš tikrųjų pažeidžia funkcionalumą, kuris remiasi vietinėmis paslėptomis galimybėmis, paliekame pasirinkimą inžinieriams.
|
Paskelbta 2019-05-22 14:02:02
|
|
|
