Autocomplete

[Alfonso2k]

Autocomplete wont compile.

Hello, I have been trying to implement the autocomplete component with the source code provided but it wont compile because next line :
<ng-container *ngIf="!emptyTemplate; else empty"> {{ searchResultMessageText }} </ng-container> <ng-container #empty *ngTemplateOutlet="emptyTemplate"></ng-container>
Here, empty is undefined. What I am doing wrong? Thanks.

Environment

Development.

Reproducer

No response

Angular version

18.2.3

PrimeNG version

18.0.0

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

v20.18.0

Browser(s)

No response

Steps to reproduce the behavior

No response

Expected behavior

No response

[can-oezkan]

You are probably referring to this in the source code:

primeng/src/app/components/autocomplete/autocomplete.ts

Lines 253 to 258 in 4cff23c

	<li *ngIf="!items || (items && items.length === 0 && showEmptyMessage)" class="p-autocomplete-empty-message" [ngStyle]="{ height: scrollerOptions.itemSize + 'px' }" role="option">
	<ng-container *ngIf="!emptyTemplate; else empty">
	{{ searchResultMessageText }}
	</ng-container>
	<ng-container #empty *ngTemplateOutlet="emptyTemplate"></ng-container>
	</li>

I can't tell you why you're getting this error, but you could try using the new control flow syntax from angular. This is the version that uses the new control flow syntax:

primeng/packages/primeng/src/autocomplete/autocomplete.ts

Lines 267 to 273 in a173984

	<li *ngIf="!items || (items && items.length === 0 && showEmptyMessage)" class="p-autocomplete-empty-message" [ngStyle]="{ height: scrollerOptions.itemSize + 'px' }" role="option">
	@if (!empty) {
	{{ searchResultMessageText }}
	} @else {
	<ng-container *ngTemplateOutlet="empty"></ng-container>
	}
	</li>

(note that they renamed emptyTemplate to empty)

I Hope that this helps :)

[cetincakiroglu]

Hi,

Thanks a lot for testing the beta and reporting the issue. Issue is fixed in 1cff1d8