Comment puis-je générer dynamiquement une ng-inclure la src?

J'ai le code suivant:

<div ng-repeat="module in modules" id="{{module.Id}}">
    <ng-include ng-init="bootstrapModule(module.Id)" src=""></ng-include>
</div>

Je veux être en mesure de construire une chaîne de la src comme suit:

/modules/{{module.Name}}/{{module.Name}}.tpl.html

Mais je continue à frapper les obstacles. J'ai essayé d'utiliser une fonction de rappel pour la construire, 

$scope.constructTemplateUrl = function(id) {
    return '/modules/' + id + '/' + id + '.tpl.html';
}

Mais ce qui est appelé plus & plus & plus et il ne semble pas comme ça. J'ai aussi essayé de le construire comme suit:

ng-src="/modules/{{module.Id}}/{{module.Id}}.tpl.html"

Mais qui ne fonctionne pas non plus. Plutôt que de passer des heures à tourner autour du pot, je me demandais si quelqu'un d'autre a venir contre quelque chose de ce genre et a des idées?

Aussi, quand je prends les modules de dollars de ressources, je suis de retour de manière asynchrone avec $q, donc je ne peux pas sembler aller de travers et l'ajouter dans les modules avant dans le contrôleur comme $scope.modules juste équivaut à un then de la fonction en ce point.

Des idées?

  • quelle erreur avez-vous ?
InformationsquelleAutor Adam K Dean | 2013-09-24
  1. 58

    ngInclude | src directive exige angulaire de l'expression, qui signifie que vous devez probablement écrire

    ng-src="'/modules/' + module.Id + '/tpl.html'"

    De http://docs.angularjs.org/api/ng.directive:ngInclude

    ngInclude|src chaîne angulaire de l'expression de l'évaluation de l'URL. Si l'
    la source est une constante de chaîne, assurez-vous que vous enveloppez-la entre guillemets, par exemple
    src="'myPartialTemplate.html'".

    Il pourrait être préférable si vous pouvez construire l'url dans le modèle au lieu de inline HTML

    <div ng-repeat="module in modules" id="{{module.Id}}">
    <ng-include src="module.url"></ng-include>
</div>
    • Votre méthode fonctionne maintenant, mais j'étais sûr que j'ai essayé avant, je dois avoir été à l'aide de ng-src au lieu de simplement src. Merci @rogerz!
    • Cela fonctionne pour moi aussi. Dans mon exemple, il fonctionne, mais j'ai une erreur 404 dans la console. Voir la réponse à la:stackoverflow.com/a/33299027/828282 des idées? Merci
    • <div ng-repeat="module in modules" id="{{module.Id}}" ng-include src="module.url"></div>
    InformationsquelleAutor rogerz