@bynary.composables.ngxs.Function.useSelect

@bynary/composables / @bynary/composables/ngxs / useSelect

Function: useSelect()

Selects a slice of data from an Store NGXS store. Uses Store#select internally and converts its observable to a signal.

Example

@Component({
   template: `
     My books:
     <ul>
       <li *ngFor="let book of books()>{{ book }}</li>
     </ul>
    `
})
class BooksComponent {

   // legacy way using an Observable
   @Select(BooksState.books)
   books$: Observable<string[]>;

   // new way using a signal
   books = useSelect(BooksState.books);
}

Param

The selector function or key

useSelect(selector)

useSelect<T>(selector): Signal<T>

Selects a slice of data from an Store NGXS store. Uses Store#select internally and converts its observable to a signal.

Type Parameters

• T

Parameters

• selector

Returns

Signal<T>

Example

@Component({
   template: `
     My books:
     <ul>
       <li *ngFor="let book of books()>{{ book }}</li>
     </ul>
    `
})
class BooksComponent {

   // legacy way using an Observable
   @Select(BooksState.books)
   books$: Observable<string[]>;

   // new way using a signal
   books = useSelect(BooksState.books);
}

Param

The selector function or key

Defined in

ngxs/src/select.composable.ts:7

useSelect(selector)

useSelect<T>(selector): Signal<T>

Selects a slice of data from an Store NGXS store. Uses Store#select internally and converts its observable to a signal.

Type Parameters

• T = any

Parameters

• selector: string | Type<any>

Returns

Signal<T>

Example

@Component({
   template: `
     My books:
     <ul>
       <li *ngFor="let book of books()>{{ book }}</li>
     </ul>
    `
})
class BooksComponent {

   // legacy way using an Observable
   @Select(BooksState.books)
   books$: Observable<string[]>;

   // new way using a signal
   books = useSelect(BooksState.books);
}

Param

The selector function or key

Defined in

ngxs/src/select.composable.ts:8

useSelect(selector)

useSelect<T>(selector): Signal<T>

Selects a slice of data from an Store NGXS store. Uses Store#select internally and converts its observable to a signal.

Type Parameters

• T

Parameters

• selector: StateToken<T>

Returns

Signal<T>

Example

@Component({
   template: `
     My books:
     <ul>
       <li *ngFor="let book of books()>{{ book }}</li>
     </ul>
    `
})
class BooksComponent {

   // legacy way using an Observable
   @Select(BooksState.books)
   books$: Observable<string[]>;

   // new way using a signal
   books = useSelect(BooksState.books);
}

Param

The selector function or key

Defined in

ngxs/src/select.composable.ts:9