在Angular中使用ngTemplateOutlet时发生模板分析错误

Question

在我的Angular代码中实现ngTemplateOutlet时，我得到了以下错误

compiler.js:2420 Uncaught Error: Template parse errors:
Parser Error: Missing expected } at column 47 in [searchListing; context: {$implicit: entityList:genericJobList,
canCreateEntity:canCreateJob, nextBookmarkList:genericNextBmJobList,'disableScroll:disableJobScroll}]
in ng:///SharedSearchModule/SearchCompareComponent.html@707:7 ("

它说错误在707线上。我在707线上的代码是ngTemplateOutlet本身的代码

<ng-container 
*ngTemplateOutlet="searchListing; context: {$implicit: entityList:genericJobList,
canCreateEntity:canCreateJob, nextBookmarkList:genericNextBmJobList, 
disableScroll:disableJobScroll}">
</ng-container>

ng模板的一部分如下：

<ng-template #searchListing let-canCreateEntity="canCreateEntity" 
let-entityList="entityList" let-nextBookmarkList="nextBookmarkList" 
let-disableScroll="disableScroll">
<!-- template code here -->
</ng-template>

根据遇到的错误，我看不到缺少}。我传递的道具类型为boolean(canCreateEntity，disableScroll(、对象数组(entityList(和字符串(nextBookmarkList(。我不能提供一个工作示例，因为我不能在不修改的情况下共享完整的代码。有人能指出的错误吗

Answer 1

您的语法错误。对于$implict，您必须传递一个有效的json对象，因此您的上下文应该如下所示：

{
$implicit: {
entityList: genericJobList,
canCreateEntity: canCreateJob,
nextBookmarkList: genericNextBmJobList,
disableScroll: disableJobScroll
}
}

当然，格式化是可选的，只是为了让代码之间的区别更清晰。您提供的错误消息甚至告诉您，预期的}应该在第47列，也就是第二个冒号所在的位置。在这一点上，该值不能再被解释为有效的json，因此它假设您忘记了右括号。

编辑

现在，我仔细研究了如何在ng-template中使用上下文，您的上下文应该是这样的：

{
entityList: genericJobList,
canCreateEntity: canCreateJob,
nextBookmarkList: genericNextBmJobList,
disableScroll: disableJobScroll
}

如果您使用$implicit，您可以参考如下上下文：

<ng-template let-whatever>
{{ whatever }}
</ng-template>

由于您不使用$implicit值，因此不必提供值。