projects.selectors.ts
angular/examples/week09-10/state/projects.selectors.ts
// @ts-nocheck
import { createFeature, createSelector } from '@ngrx/store';
import { projectsReducer, ProjectsState, selectAll, selectTotal } from './projects.reducer';
export const projectsFeature = createFeature({
name: 'projects',
reducer: projectsReducer,
});
const selectProjectsState = projectsFeature.selectProjectsState;
export const selectAllProjects = createSelector(selectProjectsState, selectAll);
export const selectProjectsLoading = createSelector(selectProjectsState, (state: ProjectsState) => state.loading);
export const selectProjectsViewModel = createSelector(selectAllProjects, selectTotal, (projects, total) => {
const activeCount = projects.filter((project) => project.status === 'active').length;
const totalBudget = projects.reduce((sum, project) => sum + project.budget, 0);
return {
projects,
totalBudget,
activeCount,
totalCount: total,
};
});
Related articles
server.js
server.js — javascript source code from the angular learning materials (angular/comprehensive-demo/server/server.js).
Read article →app.component.ts
app.component.ts — typescript source code from the angular learning materials (angular/comprehensive-demo/src/app/app.component.ts).
Read article →app.config.ts
app.config.ts — typescript source code from the angular learning materials (angular/comprehensive-demo/src/app/app.config.ts).
Read article →app.routes.ts
app.routes.ts — typescript source code from the angular learning materials (angular/comprehensive-demo/src/app/app.routes.ts).
Read article →auth.guard.ts
auth.guard.ts — typescript source code from the angular learning materials (angular/comprehensive-demo/src/app/core/guards/auth.guard.ts).
Read article →role.guard.ts
role.guard.ts — typescript source code from the angular learning materials (angular/comprehensive-demo/src/app/core/guards/role.guard.ts).
Read article →