#html #angular #angular8 #ng-template #ngtemplateoutlet
#HTML #angular #angular8 #ng-template #ngtemplateoutlet
Вопрос:
Я получаю следующую ошибку при реализации 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). Я не могу предоставить рабочий пример, поскольку я не могу поделиться полным кодом без его изменения. Может кто-нибудь указать, в чем ошибка
Ответ №1:
Ваш синтаксис неверен. Для $implicit вы должны передать действительный объект 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
значение, вам не нужно его указывать.