我想動態地生成HTML。我有generateHtml函式，它包含了專案的回圈，目前它沒有顯示在模板中添加的適當變數。它總是在所有的迭代中顯示最后一個專案的資料來編譯html。 以下是控制器和模板的代碼
。這是我的控制器代碼
angular.module('app')。 controller('PageController', ['$scope', '$sce','$compile', '$templateRequest',
function ($scope, $sce, $compile,$templateRequest) {
$scope.itemsHtml = ''/span>;
//陣列包含動態資料。
vm.items = [{
id: 1,
名稱。'abc'。
}, {
id: 2,
名稱。'pqr',
}, {
id: 3,
name: 'stu',
}, {
id: 4,
名稱。'xyz',
}];
vm.currentItem = [];
讓templateUrl = $sce.getTrustedResourceUrl('/views/item.html') 。
$templateRequest(templateUrl).then(function(template) /span>{
vm.itemTemplate = template;
}, function(/span>) {
});
vm.generateHtml = function() /span>{
items.forEach(function (item, key) {
vm.currentItem = item;
let compiledTemplate = $compile(vm.itemTemplate)($scope).html()。
/* Append compiled dynamic html */.
$scope.itemsHtml = compiledTemplate;
});
}
function init() /span>{
vm.generateHtml()。
}
init()。
}
]);
這就是模板視圖
< script type="text/ng-template" id=" item. html">。
<div className="item- wrapper">
<div className="item-inner">/span>
{{ pageCtrl.currentItem.name }}}
</div>
<div className="action-inner">/span>
<div className="btn-action"
role="button"
ng-click="pageCtrl.edit(
pageCtrl.currentItem.id
)">
<i className="fa fa-plus"> </i>>
</div>/span>
</div>/span>
</div>/span>
</script>>
uj5u.com熱心網友回復：
我得到了這個問題的解決方案。
實際上，當我們使用編譯后，我們必須對編譯后的模板進行插值
。compiledTemplate = $interpolate(compiledTemplate)($scope);
let compiledTemplate = $compile(vm. itemTemplate）（$scope）.html()。
/* 這里是插值編譯的模板*/。
compiledTemplate = $interpolate(compiledTemplate)($scope) 。
/* Append compiled dynamic html */
$scope.itemsHtml =compiledTemplate;
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/307486.html
標籤：