Nie bardzo rozumiem, kiedy należy użyć dyrektywy, a kiedy bardziej odpowiednie byłoby użycie nginclude. Weźmy ten przykład: mam częściowy, password-and-confirm-input-fields.htmlczyli html do wprowadzania i potwierdzania hasła. Używam tego zarówno pod stroną rejestracji, jak i stroną zmiany hasła. Każda z tych dwóch stron ma kontroler, część HTML nie ma dedykowanego kontrolera.
Powinienem używać dyrektywy czy ngIncludedo tego?
Odpowiedzi:
Wszystko zależy od tego, czego chcesz od fragmentu kodu. Osobiście, jeśli kod nie ma żadnej logiki lub nawet nie potrzebuje kontrolera, to idę z ngInclude. Zazwyczaj umieszczam duże, bardziej „statyczne” fragmenty HTML, których nie chcę zaśmiecać widoku. (tj. powiedzmy, że duża tabela, której dane i tak pochodzą z kontrolera nadrzędnego. Czystsze jest mieć <div ng-include="bigtable.html" />niż wszystkie te wiersze zaśmiecające Widok)
Jeśli istnieje logika, manipulacja DOM lub potrzebujesz możliwości dostosowania (inaczej renderowania) w różnych instancjach, to directivessą lepszym wyborem (na początku są zniechęcające, ale są bardzo potężne, daj temu czas) .
Czasami zauważysz, ngInclude'sże wpływa na to ich wygląd zewnętrzny $scope/ interface. Na przykład duży / skomplikowany repeater. Z tego powodu te 2 interfejsy są ze sobą powiązane. Jeśli coś w głównej części się $scopezmieni, musisz zmienić / zmienić swoją logikę w ramach dołączonej części.
Z drugiej strony dyrektywy mogą mieć wyraźne zakresy / kontrolery / itp. Więc jeśli myślisz o scenariuszu, w którym musiałbyś ponownie użyć czegoś wiele razy, możesz zobaczyć, jak podłączenie własnego zakresu ułatwiłoby życie i zmniejszyło mylące.
Poza tym za każdym razem, gdy będziesz w ogóle wchodzić w interakcję z DOM, powinieneś użyć dyrektywy. To sprawia, że jest lepszy do testowania i oddziela te akcje od kontrolera / usługi / itp., Co jest czymś, czego chcesz!
Wskazówka: jeśli zależy Ci na IE8, pamiętaj, aby nie używać ograniczenia: „E”! Są sposoby na obejście tego, ale są denerwujące. Po prostu ułatw sobie życie i trzymaj się atrybutu / itp.<div my-directive />
Dodany w Angular 1.5, jest zasadniczo opakowaniem .directve(). Komponent powinien być używany przez większość czasu. Usuwa wiele standardowych kodów dyrektywy, domyślnie ustawiając takie rzeczy jak restrict: 'E', scope : {}, bindToController: true. Gorąco polecam używanie ich do prawie wszystkiego w twojej aplikacji, aby móc łatwiej przejść na Angular2.
Powinieneś tworzyć komponenty i dyrektywy przez większość czasu.
Teraz, gdy Angular 2 powoli się kończy i znamy ogólny format (oczywiście nadal będą pewne zmiany tu i tam), po prostu chcieliśmy dodać, jak ważne jest to zrobić components(czasami dyrektywy, jeśli chcesz, aby były ograniczone: '' E 'na przykład).
Komponenty są bardzo podobne do Angular 2 @Component. W ten sposób hermetyzujemy logikę i html w tym samym obszarze.
Upewnij się, że zawarłeś jak najwięcej rzeczy w komponentach, dzięki temu przejście na Angular 2 będzie o wiele łatwiejsze! (Jeśli zdecydujesz się na przejście)
Oto fajny artykuł opisujący ten proces migracji za pomocą directives(bardzo podobny, jeśli zamierzasz używać komponentów oczywiście): http://angular-tips.com/blog/2015/09/migrating-directives-to-angular-2/
linkfunkcji i voila! Ale bez wątpienia fajnie by było upiec w dyrektywach :( @Arwin