Pod warunkiem elementu HTML typu div, jak ustawić wartość jego idatrybutu, który jest konkatenacją zmiennej zasięgu i łańcucha?
Pod warunkiem elementu HTML typu div, jak ustawić wartość jego idatrybutu, który jest konkatenacją zmiennej zasięgu i łańcucha?
Odpowiedzi:
ngAttr Dyrektywa może tu całkowicie pomóc, jak wprowadzono w oficjalnej dokumentacji
https://docs.angularjs.org/guide/interpolation#-ngattr-for-binding-to-arbitrary-attributes
Na przykład, aby ustawić idwartość atrybutu divelementu, tak aby zawierał indeks, fragment widoku może zawierać
<div ng-attr-id="{{ 'object-' + myScopeObject.index }}"></div>
który zostanie interpolowany do
<div id="object-1"></div>
myScopeObjectjest własnością scopeobiektu odsłoniętego za pomocą kontrolera. Zobacz także docs.quarejs.org/guide/controller . Czy to dla ciebie wystarczająco jasne, czy powinienem dalej opracowywać?
<div id="{{ 'object' + index }}">i <div ng-attr-id="{{ 'object' + index }}">? Dokumenty zdają się mówić, że przygotowywanie ng-attr-ma pomóc w przypadkach, w których element jest czymś niestandardowym, na przykład nie <div>. Czy czytam dokumenty, prawda?
Ta rzecz działała dla mnie całkiem dobrze:
<div id="{{ 'object-' + $index }}"></div>
ng-attr-idjest korzystny w 0% sytuacji. Nie można podać żadnych przykładów, ponieważ nie ma żadnych.
ng-attr-idSposobem jest zapewnienie, że surowe ng ekspresja nie staje się ważnym atrybutem HTML (na przykład id, labelitp). Ma to na celu powstrzymanie dalszego odczytu „śmieci” (np. Przed zakończeniem renderowania lub po awarii js)
Na wypadek, gdybyś przyszedł do tego pytania, ale dotyczył nowszej wersji Angular> = 2.0 .
<div [id]="element.id"></div>
Bardziej eleganckim sposobem na osiągnięcie tego zachowania jest po prostu:
<div id="{{ 'object-' + myScopeObject.index }}"></div>
Dla mojej implementacji chciałem, aby każdy element wejściowy w powtórzeniu ng miał niepowtarzalny identyfikator do powiązania etykiety. Tak więc dla tablicy obiektów zawartych w myScopeObjects można to zrobić:
<div ng-repeat="object in myScopeObject">
<input id="{{object.name + 'Checkbox'}}" type="checkbox">
<label for="{{object.name + 'Checkbox'}}">{{object.name}}</label>
</div>
Możliwość generowania unikalnych identyfikatorów w locie może być bardzo przydatna podczas dynamicznego dodawania takich treści.
Właśnie <input id="field_name_{{$index}}" />
Jeśli użyjesz tej składni:
<div ng-attr-id="{{ 'object-' + myScopeObject.index }}"></div>
Angular renderuje coś takiego:
<div ng-id="object-1"></div>
Jednak ta składnia:
<div id="{{ 'object-' + $index }}"></div>
wygeneruje coś takiego:
<div id="object-1"></div>
ng-attr-idtworzyć ng-id...? to jest źle. Zastanawiam się, kto to zagłosował
myScopeObjectpochodzi? Gdzie mam to zdefiniować?