Ik bekijk momenteel deze introductievideovoor angular.js
Op een gegeven moment (na 12’40”) stelt de spreker dat de attributen ng-app
en data-ng-app=""
min of meer equivalent binnen de <html>
-tag, en dat geldt ook voor ng-model="my_data_binding
en data-ng-model="my_data_binding"
. De spreker zegt echter dat de html gevalideerd wordt door verschillende validators, afhankelijk van welk attribuut wordt gebruikt.
Kun je het verschil uitleggen tussen de twee manieren, ng-
prefix tegen data-ng-
prefix ?
Antwoord 1, autoriteit 100%
Goede vraag. Het verschil is eenvoudig – er is absoluut geen verschil tussen de twee behalvedat bepaalde HTML5-validators een fout zullen genereren op een eigenschap zoals ng-app
, maar ze geven geen een fout voor alles met het voorvoegsel data-
, zoals data-ng-app
.
Dus om je vraag te beantwoorden, gebruik data-ng-app
als je je HTML wat makkelijker wilt valideren.
Leuk weetje: je kunt ook x-ng-app
gebruiken voor hetzelfde effect.
Antwoord 2, autoriteit 16%
Angular normaliseert de tag en attribuutnaam van een element om te bepalen
welke elementen bij welke richtlijnen passen. We verwijzen meestal naar:
instructies door hun hoofdlettergevoelige camelCase genormaliseerde naam (bijv.
ngModel). Omdat HTML echter niet hoofdlettergevoelig is, verwijzen we naar:
richtlijnen in de DOM door kleine letters, meestal met behulp van
door streepjes gescheiden attributen op DOM-elementen (bijv. ng-model).Het normalisatieproces is als volgt:
Strip x- en data- van de voorkant van het element/de attributen. Converteer de :, – of _-gescheiden naam naar camelCase. Hier zijn enkele equivalenten
voorbeelden van elementen die overeenkomen met ngBind:
gebaseerd op bovenstaande verklaring hieronder zijn allemaal geldige richtlijnen
1. ng-bind
2. ng:bind
3. ng_bind
4. data-ng-bind
5. x-ng-bind
Antwoord 3, autoriteit 7%
De verschillen zitten in het feit dat aangepaste data-*
attributen geldig zijn in de HTML5-specificatie. Dus als u uw opmaak nodig heeft om te worden gevalideerd, moet u deze gebruiken in plaats van de ng
-attributen.
Antwoord 4, autoriteit 4%
Kort antwoord:
ng-model
en data-ng-model
zijn hetzelfde en equivalent!
Waarom?
-
reden voor:
data-
voorvoegsel
HTML5-specificatie verwacht dat elk aangepast kenmerk wordt voorafgegaan doordata-
. -
reden voor:zowel
ng-model
alsdata-ng-model
zijn hetzelfde en equivalent.
AngularJS-document – Normalisatie
Angular normaliseert de tag en de attribuutnaam van een element om te bepalen welke elementen overeenkomen met welke richtlijnen. We verwijzen doorgaans naar richtlijnen met hun hoofdlettergevoelige camelCasegenormaliseerde naam (bijv.
ngModel
). Omdat HTML echter niet hoofdlettergevoelig is, verwijzen we naar richtlijnen in het DOM in kleine letters, meestal met behulp van door streepjes gescheidenattributen op DOM-elementen (bijv.ng-model
).Het normalisatieproces is als volgt:
1. Stripx-
endata-
van de voorkant van het element/de attributen.
2. Converteer de:
,-
, of_
-gescheiden naam naarcamelCase
.Bijvoorbeeld
De volgende formulieren zijn allemaal equivalent en passen bij de NGBIND-richtlijn:
<div ng-controller="Controller">
Hello <input ng-model='name'> <hr/>
<span ng-bind="name"></span> <br/>
<span ng:bind="name"></span> <br/>
<span ng_bind="name"></span> <br/>
<span data-ng-bind="name"></span> <br/>
<span x-ng-bind="name"></span> <br/>
</div>
Antwoord 5
U kunt gegevens-ng-, in plaats van ng-, als u uw pagina HTML geldig wilt maken.
Antwoord 6
Als u HTML- of HTML-fragmenten op uw server wilt manipuleren voordat u het naar de browser wilt dienen, wilt u zeker data-NG-XXX-kenmerken gebruiken in plaats van alleen NG-XXX-kenmerken.
- Het maakt uw HTML geldig, wat betekent dat het kan worden gebruikt door HTML (Server-gebaseerde) parsers zoals DOMDocument (PHP) of anderen. Deze parsers falen vaak niet goed gevormd HTML.
- Angularis normaliseert het attribuut, maar vergeet niet, dat staat op de client, niet op de server.