我有一个HTML模板,该模板从 Controller 的数组加载数据并将其保存在表中。我也有一条指令,它可以对表行进行包含。数据数组是根据API请求填充的。新请求之后,我将请求结果合并到了表中。将为每个请求添加一组行,而不是清除先前的结果。
我已经调试了 Controller 代码,以检查数组的状态,并在每次请求之前将其清除。这是肯定的。但是,新结果将添加到以前的结果中。我认为原因可能在我的包含伪指令模板中。
模板如下所示:
<div class="row">
<div class="col-md-12">
<div id="results" ng-show="results.length > 0">
<table class="table result-table">
<thead>
<tr>
<th>1</th>
<th>2</th>
<th>3</th>
<th>4</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="result in results" my-result></tr>
</tbody>
</table>
</div>
</div>
</div>
这是我的包含指令的代码:
angular.module('app').directive('myResult',
['$compile',
function ($compile) {
return {
transclude: true,
templateUrl: '/Scripts/app/templates/resultTemplate.html',
compile: function (tElement, tAttr, transclude) {
var contents = tElement.contents().remove();
var compiledContents;
return function (scope, iElement, iAttr) {
if (!compiledContents) {
compiledContents = $compile(contents, transclude);
}
compiledContents(scope, function (clone, scope) {
iElement.replaceWith(clone);
});
};
}
}
}]);
最后是用于包含的模板:
<tr class="big-bord">
<td colspan="4"><h3>{{result.fullName}}</h3></td>
</tr>
<tr ng-repeat="item in result.items">
<td>{{item.value1}}</td>
<td>{{item.value2}}</td>
<td>{{item.value3}}</td>
<td>{{item.value4}}</td>
</tr>
如何在每个API请求之前清除结果?
最佳答案
我解决了我的问题。事实证明,一个表中允许多个
标签。所以我只是将ng-repeat移到了标签:<tbody ng-repeat="result in results">
<tr class="big-bord">
<td colspan="4"><h3>{{result.fullName}}</h3></td>
</tr>
<tr ng-repeat="item in result.items">
<td>{{item.value1}}</td>
<td>{{item.value2}}</td>
<td>{{item.value3}}</td>
<td>{{item.value4}}</td>
</tr>
</tbody>
因此,我根本不需要任何指令。
08-07 07:04