Est-il un moyen dynamique de rendu différents modèles pour un angulaires 1.5 composant
J'ai un certain nombre de angulaire de 1,5 composants qui prennent tous les mêmes attributs et la structure des données. Je pense qu'ils pourraient être de nouveau pris en compte dans un seul composant, mais j'ai besoin d'un moyen de choisir de manière dynamique un modèle basé sur la valeur interpolée de la type
attribut.
var myComponentDef = {
bindings: {
type: '<'
},
templateUrl: //This should be dynamic based on interpolated type value
};
angular.module('myModule').component('myComponent', myComponentDef);
Je ne peux pas utiliser le templateUrl function($element, $attrs) {}
parce que les valeurs de la $attrs
sont uninterpolated donc je n'aurais pas le type spécifié dans le passé dans les données.
Je pouvais juste avoir un gros modèle avec une série de ng-if
ou ng-switch
directives, mais je tiens à garder les modèles distincts.
Sinon, je pouvais garder les composants séparés et l'utilisation ng-switch
etc dans le composant parent, mais je n'aime pas ce qu'il semble, comme beaucoup de répétition.
Je suis à la recherche d'une solution où je peux utiliser l'interpolation type
passé dans les liaisons pour correspondre à un modèle d'url pour chaque type qui sera ensuite utilisé pour construire le composant.
Est-ce possible?
Grâce
$compile
service qui n'est pas disponible pour les composants. Vous pouvez utiliser la directive.voir cette solution simple et élégante: stackoverflow.com/a/41743424/1274852
OriginalL'auteur Joe | 2016-07-28
Vous devez vous connecter pour publier un commentaire.
Ce n'est pas quelque chose que les composants ont été spécialement conçus pour. La tâche se rétrécit vers le bas à l'aide d'une directive avec des modèles dynamiques. L'existant est
ng-include
.De l'utiliser au sein d'un composant, il convient de:
this.templateUrl = typeMapperConfig[this.type];
Bien sûr, ce sera trop de travail.
OriginalL'auteur estus
Vous devez avoir la commutation de la logique, quelque part, en tout cas, alors pourquoi ne pas tout simplement chez un parent, un modèle de composant?
Avoir propre et compréhensible AngularJS modèle dans ce cas est de l'OMI plus de valeur qu'un peu de répétition:
Même si vous modifiez la myComponentDef.le type à la volée, les composants du commutateur correctement appeler leurs respectifs
$onDestroy
et$onInit
les méthodes et les données de charge comme prévu, pas de magie, pas de vaudou.OriginalL'auteur Vedran