嗨,我正在按照演示示例使用合金 ui 分页器
这是我的网页内容模板代码:
#set($allTags = [])
#set($void = $allTags.add('news'))
#set($void = $allTags.add('alert'))
#set($tempArr=[])
#set($tempArr=$allTags)
#set($arr=$tempArr.toArray($allTags))
#set($stringArray=$arrayUtil.toStringArray($arr))
#set($assetTagLocalService = $serviceLocator.findService("com.liferay.portlet.asset.service.AssetTagLocalService"))
#set($tagIds = $assetTagLocalService.getTagIds($groupId,$stringArray))
#set($assetEntryQuery = $portal.getClass().forName("com.liferay.portlet.asset.service.persistence.AssetEntryQuery" ).newInstance())
#set($V1 = $assetEntryQuery.setAnyTagIds($tagIds))
#set($className = $portal.getClass().forName("com.liferay.portlet.journal.model.JournalArticle").getName())
#set($V2 = $assetEntryQuery.setClassName($className))
#set($assetEntryLocalService = $serviceLocator.findService("com.liferay.portlet.asset.service.AssetEntryLocalService"))
#set($assetEntryList = $assetEntryLocalService.getEntries($assetEntryQuery))
#set($journalArticleResourceService =$serviceLocator.findService('com.liferay.portlet.journal.service.JournalArticleResourceLocalService'))
#set($journalArticleService =$serviceLocator.findService('com.liferay.portlet.journal.service.JournalArticleLocalService'))
<style type="text/css">
.aui-paginator-container {
margin: 30px;
}
.paginator-content {
border: 2px solid #CCCCCC;
font-size: 15px;
margin: -10px 40px;
padding: 10px;
width: 534px;
}
.paginator-content div {
display: none;
}
</style>
<script type="text/javascript">
AUI().ready('aui-paginator', function(A) {
var paginator = new A.Paginator(
{
containers: '.paginator',
maxPageLinks: 10,
on: {
changeRequest: function(event) {
var instance = this;
var newState = event.state;
var page = newState.page;
if (newState.before) {
var lastPage = newState.before.page;
A.one('.paginator-content .page' + lastPage).setStyle('display', 'none');
}
A.one('.paginator-content .page' + page).setStyle('display', 'block');
instance.setState(newState);
}
},
rowsPerPage: 3,
rowsPerPageOptions: [ 1, 3, 5, 7 ],
total: 10
}
)
.render();
});
</script>
<div class="main-col">
<div id="post-list" class="pane">
<div class="pane-heading">
<h1>News & Alerts</h1>
</div>
<div class="pane-heading">
<select id="filter-report-tld" name="filter-report-tld">
<option value="">Choose a filter...</option>
<option value="all" selected="selected">All news & alerts</option>
<option value="academy">News</option>
<option value="corp">Alerts</option>
</select>
<div class="clear"></div>
</div>
<div class="pane-body">
<div class="post-table">
<div class="post-list-hg">
<div class="post-list-title"><a href="xxx">Title</a> - $assetEntryList.size() items</div>
<div class="post-list-date sort-descend"><a href="xxx">Post date</a></div>
</div>
<div class="paginator"></div>
<div class="paginator-content">
#set ($counter = 1)
#foreach($assetEntry in $assetEntryList)
#set($articleResource = $journalArticleResourceService.getJournalArticleResource($assetEntry.getClassPK()))
#set($article = $journalArticleService.getArticle($groupId,$articleResource.getArticleId()))
#set ($document = $saxReaderUtil.read($article.title))
#set ($root = $document.getRootElement())
#set ($articleTitle = $root.selectSingleNode("Title").getText())
<div class="page$counter">
$articleTitle
</div>
#set ($counter = $counter + 1)
#end
</div>
<div class="paginator"></div>
</div>
</div>
</div>
</div>
你能告诉我如何使用alloyUI分页器在我的foreach循环中显示项目吗?现在每个项目都出现在一页中。