在变量中存储.load html文件的内容

On button click, i am appending a tfoot to a table. The contents of the tfoot is the result of a .load to a local .html file. Although my solution works, i am performing a get to the .html file on every click. Can the result on first click be stored in a variable, and reused?

在按钮上单击，我将一个tfoot添加到一个表中。tfoot的内容是.load到本地.html文件的结果。尽管我的解决方案有效，但每次单击时我都会执行get to .html文件。第一次单击的结果可以存储在变量中并重用吗?

$scope.btnClick = function() {

    var tfoot = $('#datepicker table').find('tfoot');
    if(!tfoot.length) {
        tfoot = $('<tfoot>').appendTo('#datepicker table');
    }

    tfoot.load('myDir/calendar/customFooter.html');

}

2 个解决方案

#1

You can achieve this by using a callback on the load() method to store the result. I use your $scope variable for this, but you can amend this as needed. Try this:

您可以通过使用load()方法上的回调来存储结果来实现这一点。我使用您的$scope变量，但是您可以根据需要修改它。试试这个:

$scope.btnClick = function() {    
    var tfoot = $('#datepicker table').find('tfoot');
    if (!tfoot.length) {
        tfoot = $('<tfoot>').appendTo('#datepicker table');
    }

    if ($scope.tfootContent) {
        tfoot.html($scope.tfootContent);
    } else {
        tfoot.load('myDir/calendar/customFooter.html', function(response) {
            $scope.tfootContent = response;
        }); 
    }
}

#2

You can use the templateCache for this, (see reference here -> https://docs.angularjs.org/api/ng/service/$templateCache) I believe that would be a better approach. That way you don't need to do additional work and it will get cached. You'd show the tfoot on button click so it would be something like this:

您可以为此使用templateCache，(请参阅这里的参考资料—> https://docs.angularjs.org/api/ng/service/$templateCache)我认为这是一种更好的方法。这样，您就不需要做额外的工作，它将被缓存。你会在按钮上显示tfoot点击所以会是这样的:

$scope.btnClick = function() { tfootVisible = true;}

and in the html

在html

<table id="datepicker">
   <tfoot ng-include="'templateId.html'" ng-if="tfootVisible"></tfoot>
</table>

#1