我有一个app-projects模板，它是ProjectComponent的列表。
对于ProjectComponent。我有应用程序项目模板。
<ul>
<li *ngFor="let project of projects">
<app-project></app-project>
</li>
</ul>
组件：
@Component({
selector: 'app-project',
templateUrl: './project.component.html',
styleUrls: ['./project.component.css']
})
export class ProjectComponent implements OnInit {
constructor(title: string, description: string, questions: string[]) { }
ngOnInit() {
}
}
所以，现在我想在应用其模板时迭代各个projectComponents。
但是我不知道该怎么做：如果我要坚持使用单独的模板，我将不得不以某种方式将项目传递给模板。
我发现通过Inputs可以使用单个属性，但这对我没有太大帮助。
答案 0 :(得分：1)
首先，您需要使用<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
xmlns:msa="http://www.publictalksoftware.co.uk/msa">
<xsl:output method="html" indent="yes" version="4.01"
doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
doctype-public="//W3C//DTD XHTML 1.0 Transitional//EN"/>
<xsl:template match="/">
<html>
<head>
<title>Publishers Report</title>
<link rel="stylesheet" type="text/css" href="Custom Publisher Report.css"/>
<meta http-equiv="X-UA-Compatible" content="IE=11"/>
<script src="//code.jquery.com/jquery-1.4.2.js" type="text/javascript"></script>
<script src="https://rawgithub.com/padolsey/jQuery-Plugins/master/sortElements/jquery.sortElements.js" type="text/javascript"></script>
<script type="text/javascript">
$(window).load(function(){
var table = $('table');
$('#column-1, #column-2, #column-3, #column-4, #column-5, #column-6')
.wrapInner('<span title="Sort this column"/>')
.each(function(){
var th = $(this),
thIndex = th.index(),
inverse = false;
th.click(function(){
table.find('td').filter(function(){
return $(this).index() === thIndex;
}).sortElements(function(a, b){
return $.text([a]) > $.text([b]) ?
inverse ? -1 : 1
: inverse ? 1 : -1;
}, function(){
// parentNode is the element we want to move
return this.parentNode;
});
inverse = !inverse;
});
});
});
</script>
</head>
<body>
<xsl:variable name="PubDB" select="document('MSA_PublisherDatabase.XML')"/>
<table>
<thead>
<th class="cellSortHeading" id="column-1">Student</th>
<th class="cellSortHeading" id="column-2">Last As Student</th>
<th class="cellSortHeading" id="column-3">Last Bible Reading</th>
<th class="cellSortHeading" id="column-4">Last As Publisher</th>
<th class="cellSortHeading" id="column-5">Last As Talk</th>
<th class="cellSortHeading" id="column-6">Last As Assistant</th>
</thead>
<tbody>
<xsl:apply-templates select="$PubDB/msa:PublisherDatabase/msa:Publishers/msa:Publisher">
<xsl:sort select="msa:Name" data-type="text" order="ascending"/>
</xsl:apply-templates>
</tbody>
</table>
</body>
</html>
</xsl:template>
<xsl:template match="msa:Publisher">
<xsl:variable name="HistoryDB" select="document('AssignHistory.XML')"/>
<xsl:variable name ="SearchName" select="msa:Name"/>
<tr>
<!--The first cell is the name-->
<td>
<xsl:value-of select="msa:Name"/>
</td>
<!--The next cell is the most recent Student date-->
<!--So we need to locate all "Bible Reading" items for the name in question-->
<!--We sort the entries in date descending order so that the first entry is the most recent-->
<td>
<xsl:for-each select="$HistoryDB/AssignmentHistory/*/StudentItems/Item[Description != 'Assistant' and Name = $SearchName]">
<xsl:sort select="$HistoryDB/AssignmentHistory/*" order="descending" data-type="text"/>
<!--We only want the first entry-->
<xsl:if test="position()=1">
<xsl:call-template name="DisplayItemDate">
<xsl:with-param name="ItemDate" select="name(../..)"/>
</xsl:call-template>
</xsl:if>
</xsl:for-each>
<!--If no entries were found then it need to write out "<xsl:text> </xsl:text>" How?-->
</td>
<!--The next cell is the most recent Bible Reading date-->
<!--So we need to locate all "Bible Reading" items for the name in question-->
<!--We sort the entries in date descending order so that the first entry is the most recent-->
<td>
<xsl:for-each select="$HistoryDB/AssignmentHistory/*/StudentItems/Item[Description = 'Bible Reading' and Name = $SearchName]">
<xsl:sort select="$HistoryDB/AssignmentHistory/*" order="descending" data-type="text"/>
<!--We only want the first entry-->
<xsl:if test="position()=1">
<xsl:call-template name="DisplayItemDate">
<xsl:with-param name="ItemDate" select="name(../..)"/>
</xsl:call-template>
</xsl:if>
</xsl:for-each>
<!--If no entries were found then it need to write out "<xsl:text> </xsl:text>" How?-->
</td>
<!--The next cell is the most recent Publisher date-->
<!--So we need to locate all "Bible Reading" items for the name in question-->
<!--We sort the entries in date descending order so that the first entry is the most recent-->
<td>
<xsl:for-each select="$HistoryDB/AssignmentHistory/*/StudentItems/Item[Description != 'Talk' and Description != 'Assistant' and Name = $SearchName]">
<xsl:sort select="$HistoryDB/AssignmentHistory/*" order="descending" data-type="text"/>
<!--We only want the first entry-->
<xsl:if test="position()=1">
<xsl:call-template name="DisplayItemDate">
<xsl:with-param name="ItemDate" select="name(../..)"/>
</xsl:call-template>
</xsl:if>
</xsl:for-each>
<!--If no entries were found then it need to write out "<xsl:text> </xsl:text>" How?-->
</td>
<!--The next cell is the most recent Talk date-->
<!--So we need to locate all "Bible Reading" items for the name in question-->
<!--We sort the entries in date descending order so that the first entry is the most recent-->
<td>
<xsl:for-each select="$HistoryDB/AssignmentHistory/*/StudentItems/Item[Description = 'Talk' and Name = $SearchName]">
<xsl:sort select="$HistoryDB/AssignmentHistory/*" order="descending" data-type="text"/>
<!--We only want the first entry-->
<xsl:if test="position()=1">
<xsl:call-template name="DisplayItemDate">
<xsl:with-param name="ItemDate" select="name(../..)"/>
</xsl:call-template>
</xsl:if>
</xsl:for-each>
<!--If no entries were found then it need to write out "<xsl:text> </xsl:text>" How?-->
</td>
<!--The last cell is the most recent Assistant date-->
<!--So we need to locate all "Bible Reading" items for the name in question-->
<!--We sort the entries in date descending order so that the first entry is the most recent-->
<td>
<xsl:for-each select="$HistoryDB/AssignmentHistory/*/StudentItems/Item[Type = 'Assistant' and Name = $SearchName]">
<xsl:sort select="$HistoryDB/AssignmentHistory/*" order="descending" data-type="text"/>
<!--We only want the first entry-->
<xsl:if test="position()=1">
<xsl:call-template name="DisplayItemDate">
<xsl:with-param name="ItemDate" select="name(../..)"/>
</xsl:call-template>
</xsl:if>
</xsl:for-each>
<!--If no entries were found then it need to write out "<xsl:text> </xsl:text>" How?-->
</td>
</tr>
</xsl:template>
<xsl:template name="DisplayItemDate">
<xsl:param name="ItemDate"/>
<xsl:value-of select="substring($ItemDate, 8, 2)"/>
<xsl:text>/</xsl:text>
<xsl:value-of select="substring($ItemDate, 6, 2)"/>
<xsl:text>/</xsl:text>
<xsl:value-of select="substring($ItemDate, 2, 4)"/>
</xsl:template>
</xsl:stylesheet>
将project作为输入属性放入ProjectComponent中。
您可以像下面这样使用：
ProjectComponent：
@Input()在您使用export class ProjectComponent {
@Input() project;
constructor() { }
}
的模板中，您需要像下面这样将<app-project>属性输入到project中：
ProjectComponent希望这对您有帮助！