web-dev-qa-db-ja.com

ng-include srcを動的に構築するにはどうすればよいですか?

私は次のコードを持っています:

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

私はsrcの文字列を次のように構築できるようにしたい:

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

しかし、私は障害を突き続けます。コールバック関数を使用して構築しようとしましたが、

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

しかし、これは何度も何度も呼び出され、それが好きではないようです。私もそれを次のように構築しようとしました:

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

しかし、それも機能していません。茂みの周りを何時間もspendるのではなく、他の誰かがこのようなことを思いつき、何かアイデアを持っているのではないかと思いました。

また、$ resourceからモジュールを取得すると、$ qで非同期にモジュールを返すため、$scope.modulesは、その時点でthen関数と等しいだけです。

何か案は?

27
Adam K Dean

ngInclude | srcディレクティブにはangular式が必要です。

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

から http://docs.angularjs.org/api/ng.directive:ngInclude

ngInclude | src string angular URLに評価される式。ソースが文字列定数の場合、引用符で囲むようにしてください。たとえば、src = "'myPartialTemplate.html'"。

インラインHTMLの代わりにモデルでURLを構築する方が良いかもしれません

<div ng-repeat="module in modules" id="{{module.Id}}">
    <ng-include src="module.url"></ng-include>
</div>
58
rogerz