Pourquoi replace=true
ou replace=false
n’a aucun impact dans le code ci-dessous?
Pourquoi le “certains contenus existants” n’est-il pas affiché lorsque replace = false?
Ou, pour le dire plus humblement, pouvez-vous expliquer avec gentillesse quelle est la fonction replace=true/false
dans les directives et comment l’utiliser?
Exemple
JS / Angular:
angular.module('scopes', []) .controller('Ctrl', function($scope) { $scope.title = "hello"; }) .directive('myDir', function() { return { ressortingct: 'E', replace: true, template: '{{title}}' }; });
HTML:
some existing content
Regardez-le dans Plunker ici:
Lorsque vous avez replace: true
vous obtenez le morceau suivant de DOM:
hello
alors que, avec replace: false
vous obtenez ceci:
hello
Ainsi, la propriété replace
dans les directives indique si l’élément auquel la directive est appliquée (
dans ce cas) doit restr ( replace: false
) et le modèle de la directive doit être ajouté en tant qu’enfant,
OU
l’élément auquel la directive est appliquée doit être remplacé ( replace: true
) par le modèle de la directive.
Dans les deux cas, les enfants de l’élément (auxquels la directive est appliquée) seront perdus. Si vous souhaitez conserver le contenu / les enfants d’origine de l’élément, vous devrez le traduire. La directive suivante le ferait:
.directive('myDir', function() { return { ressortingct: 'E', replace: false, transclude: true, template: '{{title}}' }; });
Dans ce cas, si dans le modèle de la directive vous avez un élément (ou des éléments) avec l’atsortingbut ng-transclude
, son contenu sera remplacé par le contenu original de l’élément (auquel la directive est appliquée).
Voir l’exemple de la traduction http://plnkr.co/edit/2DJQydBjgwj9vExLn3Ik?p=preview
Voir ceci pour en savoir plus sur la translusion.
replace:true
est obsolète De la documentation:
replace
([DEPRECATED!], sera supprimé dans la prochaine version majeure – c.-à-d. v2.0)spécifier ce que le modèle doit remplacer. La valeur par défaut est
false
.
true
– le modèle remplacera l’élément de la directive.false
– le modèle remplacera le contenu de l’élément de la directive.
– API complète de la directive AngularJS
De GitHub:
Caitp– C’est déconseillé parce qu’il y a des problèmes connus, très stupides, avec
replace: true
, dont un certain nombre ne peut pas vraiment être résolu de manière raisonnable. Si vous êtes prudent et évitez ces problèmes, alors plus de puissance pour vous, mais pour le bénéfice des nouveaux utilisateurs, il est plus facile de leur dire simplement que “cela vous donnera mal à la tête, ne le faites pas”.
– AngularJS Issue # 7636