Missing Piece of Angular 17 Signal Components

Saikiranmaddukuri
1 min readNov 16, 2023

--

Wait is over Angular 17 got released we can expirence Angular 17 renaissance as developer preview but wait is still not over as Signal Components are not a part of Angular 17 as we expected.

What are SignalComponets

For now we are using Signals just as a primitive types its true power will be unleashed when signals used in @input,@output and ngModel inplace of EventEmmiter(which are observables) if this got achived it is called SignalComponents.

For an overview signal component may look some thing like this.

@Component({
selector:"app-employee-page",
standalone:true,
signals:true,
template:`
<app-employee-list
[employees]="filteredEmployes()"
[(searchTerm)]="searchTerm"
>
</app-employee-list>
`
})
export class EmployeePage{
employeeService = inject(EmployeeService);

searchTerm = signal("");

filteredEmployees = computed(()=>{
this.employeeService.filterEmployees(this.searchTerm())
})
}
@Component({
selector:"app-employee-list",
standalone:true,
signals:true,
template:`
<h2>Filter</h2>
<input type="text" [(ngModel)]="searchTerm" />
<strong>Total employees: </strong>
<ul>
<li *ngFor="let employee of employees()">
{{ employee }}
</li>
</ul>
`
})
export class EmployeeList{
employees = input([]);
searchTerm = model([]);

totalEmployees = computed(()=> this.employees.length);
}

As per latest news Simona a Engineering Manager at Google and part of team who developed angular has mentioned few things regarding this in a special event @54:15 of Angular on the day Angular 17 got released.

Simona mentioned “we’re also prioritizing working on Signal Inputs and improving the zone less experience and eventually working towards signal components as they are described in the request for comments that we published in on GitHub a while back”.

We are egarly waiting for Signal Components soon to be a part of Angular.

--

--