Tam olarak transclude işlevi ve Klon bağlama işlevi ne olacak?
** 8, işlev, derleme görmek İ transclude
3 parametreleri vardır. Belgeleri sağlamak tek açıklaması vardır:
transclude - transclude bağlayan Bir fonksiyon: fonksiyon(kapsam, cloneLinkingFn).
Klon işlevi bağlama ne olacağını anlamaya çalışıyorum. Hatta parametreleri içine geçmiş olsun ne olduğunu bilmiyorum. Bir HTML öğesi gibi görünen bir parametre clone
çağırdı one example buldum. Diğer parametreler mevcuttur? Hangi HTML elemanı bu tam olarak nedir? Ayrıca muhtemelen benim Direktifi transclude: 'element'
kullanarak bakıyorum. Bu soruların cevapları true
yerine 'element'
kullanırken değişir?
Basit bir örnekle transclusion anlıyorum, ama daha karmaşık örnekler bulmak, özellikle transclude: 'element'
ile görünmek istemiyorum. Birileri bu konuda daha ayrıntılı bir açıklama sağlayabilir diye umuyorum. Teşekkürler.
CEVAP
EDİT: Tamamen benim cevabım değişen ve "Topluluk Wiki" (benim için hiç puan anlamında) ben de bu konuyu açtığında . düpedüz yanlış olduğu gibi bu işaretleme
@Jonah olarak aşağıda işaret here is a really good article on the compile option of directives and using the transclusion function
Temel fikir işlev derleme bağlama işlevi dönmelidir. Transclusion işlevi bağlama işlevi içinde sağlanan transcluded DOM öğesi bir klon almak, derlemek ve takılı olması gereken yere ekleyebilirsiniz.
Here is a better example I've pulled out of my butt on Plunker
İşlev derleme fikri programlı olarak DOM öğeleri, öznitelikleri bağlama işlevi oluşturulan ve çağrılmadan ÖNCE vefat dayalı değiştirmek için bir şans verir.
// a silly directive to repeat the items of a dictionary object.
app.directive('keyValueRepeat', function ($compile){
return {
transclude: true,
scope: {
data: '=',
showDebug: '@'
},
compile: function(elem, attrs, transclude) {
if(attrs.showDebug) {
elem.append('<div class="debug">DEBUG ENABLED {{showDebug}}</div>');
}
return function(scope, lElem, lAttrs) {
var items = [];
console.log(lElem);
scope.$watch('data', function(data) {
// remove old values from the tracking array
// (see below)
for(var i = items.length; i-- > 0;) {
items[i].element.remove();
items[i].scope.$destroy();
items.splice(i,1);
}
//add new ones
for(var key in data) {
var val = data[key],
childScope = scope.$new(),
childElement = angular.element('<div></div>');
// for each item in our repeater, we're going to create it's
// own scope and set the key and value properties on it.
childScope.key = key;
childScope.value = val;
// do the transclusion.
transclude(childScope, function(clone, innerScope) {
//clone is a copy of the transcluded DOM element content.
console.log(clone);
// Because we're still inside the compile funciton of the directive,
// we can alter the contents of each output item
// based on an attribute passed.
if(attrs.showDebug) {
clone.prepend('<span class="debug">{{key}}: {{value}}</span>');
}
//append the transcluded element.
childElement.append($compile(clone)(innerScope));
});
// add the objects made to a tracking array.
// so we can remove them later when we need to update.
items.push({
element: childElement,
scope: childScope
});
lElem.append(childElement);
}
});
};
}
};
});
Bağlama Twitter Bootstrap için bir işl...
php bir işlevi varsayılan olarak dönme...
Nasıl üye işlevi ile bağlama boost kul...
Verimli paralel olarak gruplandırılmış...
özelliği bir işlevi string parametre o...