AngularJS yönergesini, içeriği sarın ve öznitelikleri orijinal öğe üzerinde saklayın.

Question

AngularJS'de oldukça yeniyim ve hala öğreniyorum.

Yönergenin uygulandığı öğeyi (ve çocuklarını) saran bir yönergeyi oluşturmakta biraz sorun yaşıyorum. AngularJS'de diğer sıradan şeylerin ne kadar kolay olduğunu göz önünde bulundurmak neden bu kadar yaygın bir senaryoyu bu kadar zorlu bulmam gerektiğini anlayamıyorum, bu yüzden burada bir şeyleri kaçırmam çok iyi olabilir.

Yapmak istediğim seçim öğesinin div içine sarılmasıdır. Orijinal seçme öğesini ve içeriğini korumak için transclude kullanıyorum ancak düzgün çalışmasını sağlayamıyorum.

<select mlb-select ng-options="opt.val as opt.text for opt in mlb" ng-model="mlbOpt"></select> 

... ve benim yönergesi şöyle görünür:

HTML şuna benzer

directiveModule.directive("mlbSelect", function(){ 
    return { 
     template: '<div class="mlb-select">' 
        + '<select ng-transclude></select>' 
        + '</div>', 
     transclude: 'element', 
     replace: true 
    } 
}); 

elde edilen HTML şöyle görünür: Elbette

<div class="mlb-select ng-pristine ng-valid" mlb-select ng-options="opt.val as opt.text for opt in mlb" ng-model="mlbOpt"> 
    <select ng-transclude class="ng-scope"></select> 
</div> 

istediğim bu değil. Seçtiğim öğemin özellikleri ng-transclude özniteliğiyle belirttiğim öğeyi değil, sarma bölmesine neden ekledi? Seçim elemanının ng-options ve ng-model özelliklerini koruması gerekir.

Bunu yapmak için ne yapmam gerekiyor? Bunu yapmanın tek yolu AFAIK

Answer 1

youe durum aynen yukarıdaki gibi ise bu yapmanın hiçbir anlamı yoktur Tabii

<div mlb-select> 
    <select ...></select> 
</div> 

.: Bir sarıcı eleman örneğin ekleme ile direktifini belirtmektir. Bu sorunun bağlamında

ekleme kabaca gibi çalışır:

1. çapraz dahil içerik transclude: true ile yönergesi vardır elemanın içeriği olduğu; Sizin durumunuzda boş olan <select> içeriği! Aktarılan içerik, yönerge şablonunda ng-transclude'u belirten öğenin içine yerleştirilir.