AngularJS 1-s, kui soovid DOM-elementide kuvaolekut sisse lülitada, kasutad tõenäoliselt AngularJS 1 sisseehitatud käske, nagu ng-show või ng-hide:
AngularJS 1 näide:
Angular2-s võimaldab uus mallisüntaks siduda avaldisi DOM-elementide natiivsete omadustega. See täiesti äge funktsioon avab lõputult võimalusi. Üks neist on avaldise sidumine natiivse peidetud omadusega, mis on natuke nagu ng-show, ja seab ka display: none elemendi jaoks:
[peidetud] näide angular2-st (ei soovitata):
Esmapilgul tundub ülaltoodud näide olevat ng-show AngularJS 1-s. Tegelikult ongi! olulised erinevused.
Nii ng-show kui ka ng-hide juhivad DOM-elementide kuvaolekut CSS-klassi ng-hide kaudu, mis lihtsalt seab elemendi kuvamiseks: puudub. Oluline on see, et AngularJS 1 on lisatud ng-hide klassi! oluline, mis reguleerib klassi prioriteeti nii, et see saaks üle kirjutada elemendi kuvamise atribuudi määramise teistest stiilidest.
Tagasi selle näite juurde – brauser on natiivse peidetud atribuudi display: none stiili rakendanud. Enamik brausereid seda ei kasuta! oluline on oma prioriteeti kohandada. Seetõttu võib elemendi kuvaoleku kontrollimine [hidden]="expression" abil kergesti kogemata teiste stiilidega üle kirjutada. Näiteks: kui kirjutan sellise stiili selle elemendi jaoks mujale, display: flex, on see tähtsam kui natiivne peidetud omadus (vt siit).
Sellepärast kasutame tavaliselt *ngIf-i, et lülitada elemendi oleku seisund sama eesmärgi saavutamiseks:
*ngIf näide angular2-st (soovitatav):
Erinevalt natiivsest peidetud omadusest ei ole *ngIf Angular2-s stiilipiiratud. Pole vahet, millist CSS-i sa kirjutad, ta on turvaline. Siiski tuleb mainida, et *ngIf ei kontrolli elemendi kuvaolekut, vaid saavutab otse kuvamise või mittekuvamise efekti, lisades või eemaldades elemendi mallist.
Loomulikult saab elementi peidetud atribuudile lisada ka peidetud prioriteedi, kasutades globaalset stiili, näiteks display: none !important, et saavutada see efekt. Võid küsida, kuna nurkgrupp teab neid probleeme, miks mitte lihtsalt lisada globaalne kõrgeima prioriteediga peidetud stiil peidetud süsteemile? Vastus on, et me ei saa garanteerida, et globaalsete stiilide lisamine on parim valik kõigi rakenduste jaoks. Kuna see lähenemine rikub tegelikult funktsionaalsuse, mis tugineb natiivsetele peidetud võimekusele, jätame valiku inseneridele.
|
Postitatud 22.05.2019 14:02:02
|
|
|
