Utilisation angulaire de la directive à l'intérieur d'une autre directive
J'ai créé le ci-dessous angulaire directives, ChildDirective qui est utilisé à l'intérieur de ParentDirective
var wizardModule = angular.module('Wizard', []);
wizardModule.directive('childDirective', function ($http, $templateCache, $compile, $parse) {
return {
restrict: 'E',
scope: [],
compile: function (iElement, iAttrs, transclude) {
iElement.append('child directive<br />');
}
}
})
wizardModule.directive('parentDirective', function ($http, $compile) {
return {
restrict: 'E',
compile: function (element, attrs) {
var x = '<child-directive></child-directive><child-directive></child-directive>';
element.append(x);
}
}
Ce qui fonctionnait normalement et plusieurs directives de l'enfant est apparu.
Je voulais mettre à jour le ParentDirective, pour obtenir la liste des childDirectives à partir du serveur. Donc j'ai mis à jour le ParentDirective code pour faire un appel ajax et ensuite tirer le ChildDirectives
var elem;
wizardModule.directive('parentDirective', function ($http, $compile) {
return {
restrict: 'E',
compile: function (element, attrs) {
var controllerurl = attrs.controllerurl;
elem = element;
if (controllerurl) {
$http.get(controllerurl + '/GetWizardItems').
success(function (data, status, headers, config) {
var x = '<child-directive></child-directive><child-directive></child-directive>';
elem.append(x);
$compile(x);
});
}
}
}
});
Le problème est que le childDirectives n'apparaît plus, bien que dans le debeggur c'est en entrant à la méthode de compilation de la childDirective
Vous devez vous connecter pour publier un commentaire.
Vous devez le lien de la compilation des élément de la portée. Et puisque vous n'êtes plus la modification de l'élément du modèle, vous devez ajouter de nouveaux éléments sur l'élément lié. Vous pouvez le faire comme ceci:
child-directive
) n'a pas de fonction de lien, pas de contrôleur et pas de liaisons dans le modèle afin d'en "travail", mais vraiment, vous devez le lier à un champ