AngularJS : 'gerçek' transclude 'öğesi transclude ne Zaman kullanılır'?

SORU

26 AĞUSTOS 2013, PAZARTESİ

AngularJS : 'gerçek' transclude 'öğesi transclude ne Zaman kullanılır'?

transclude: 'element' transclude: 'true' ve kullanmalıyım ? I cant açısal dokümanlar transclude: 'element' hakkında bir şey bulmak oldukça kafa karıştırıcı.

Eğer birisi basit bir dille bunu açıklayabilir olursa çok mutlu olurum. Her seçeneğin faydası nedir? Aralarındaki gerçek fark nedir?

Bu bulduğum şey :

transclude: true
Derleme bir işlev içinde, transclude işlevi bağlama yardımı ile DOM işleyebilirsiniz veya şablon herhangi bir HTML etiketi üzerinde ngTransclude yönergesi kullanarak transcluded DOM ekleyebilirsiniz.

transclude: ‘element’
Bu tüm eleman transcludes ve transclude bağlayan bir işlevi derleme tanıtıldı. Kapsamı henüz oluşturulmadı çünkü burada kapsamına giremezsiniz. Derleme işlev oluşturur bir bağlantı işlevi için Direktif olan erişim kapsamı ve transcludeFn sağlar dokunmatik klonlanmış elemanı (transcluded) DOM manipülasyon veya veri kullanımına bağlı dahilinde. Bilginiz olsun, bu ng-repeat içinde kullanılır ve anahtar ng.

CEVAP

27 AĞUSTOS 2013, Salı

AngularJS Documentation on Directives:

transclude element içeriği derleme ve yönergesi kullanılabilir hale getirmek. Genellikle ngTransclude ile kullanılır. Transclusion avantajı bağlama işlevi önceden bağlı kapsamı doğru olan transclusion bir işlevi alır. Tipik bir kurulum widget bir kapsam izole oluşturur, ama transclusion bir çocuk değil, ama bir kardeş kapsam izole. Bu widget özel durumu (pre-izole) üst kapsam tabi olacaktır transclusion olmasını sağlar.

true - direktifin içeriği transclude.

'element' - herhangi bir Direktif daha düşük öncelikte tanımlı dahil olmak üzere tüm öğe transclude.

transclude: gerçek

Hadi bir Direktif bu gibi transclude: true ilan my-transclude-true dedin ki:

<div>
  <my-transclude-true>
    <span>{{ something }}</span>
    {{ otherThing }}
  </my-transclude-true>
</div>

Derleme ve önce bağlama sonra bu hale gelir:

<div>
  <my-transclude-true>
    <!-- transcluded -->
  </my-transclude-true>
</div>

içerik<span>{{ something }}</span> {{..., my-transclude-true (çocuk) ve Direktife transcluded mevcuttur.

transclude: '' . eleman

Eğer varsa bir yönerge my-transclude-element denilen bu gibi görünüyor transclude: 'element' ile ilan etti

<div>
  <my-transclude-element>
    <span>{{ something }}</span>
    {{ otherThing }}
  </my-transclude-element>
</div>

Derleme ve önce bağlama sonra bu hale gelir:

<div>
   <!-- transcluded -->
</div>

Buradakendi çocukları da dahil olmak üzere tüm öğevardır transcluded ve yönergesi için kullanılabilir.

Bağladıktan sonra ne olacak?

Bu yönerge kadar transclude fonksiyonu ile yapması gereken şeyi yapmak için. ngRepeat kapsamı değiştiğinde bütün element ve çocuklar tekrarlayın böylece transclude: 'element' kullanır. Sadece etiketi değiştirmeniz gerekiyor ve içeriğini korumak istiyorsanız, ancak, bunu sizin için yapar ngTransclude Yönerge transclude: true kullanabilirsiniz.

Bunu Paylaş: