β οΈ Signals in Angular (new approach of reactivity)
#angular #signals
π© > Angular 16
β Link: https://medium.com/@simon.sharp_25406/signals-in-angular-3dc2c97ce5a6
#angular #signals
π© > Angular 16
β Link: https://medium.com/@simon.sharp_25406/signals-in-angular-3dc2c97ce5a6
js.reduce(): Deserialize query string
#js #reduce
β Example:
#js #reduce
β Example:
function ParseQueryString(queryString) {
return queryString
.replace(/(^\?)|(&$)/g, "")
.split("&")
.reduce((t, v) => {
const [key, val] = v.split("=");
t[key] = decodeURIComponent(val);
return t;
}, {});
}
const urlExample = "?name=Bytefer&email=bytefer%40gmail.com";
const queryParam = ParseQueryString(urlExample);
// queryParam: { name: 'Bytefer', email: 'bytefer@gmail.com' }β€2
js.reduce(): Split array into chunks
#js #reduce
β Example:
#js #reduce
β Example:
function Chunk(array, size) {
return array.reduce((acc, _, index) => {
if (index % size === 0) acc.push(array.slice(index, index + size));
return acc;
}, []);
}
const numbers = [1, 2, 3, 4, 5, 6, 7];
const arr3 = Chunk(numbers, 2);
// Output: arr3: [ [ 1, 2 ], [ 3, 4 ], [ 5, 6 ], [ 7 ] ]Resolver in Angular
#angular #resolver
π© > Angular 15
β Link: https://stackblitz.com/edit/angular-2kiv4w?file=src%2Fapp%2Fhero-detail%2Fhero-detail.resolver.ts
#angular #resolver
π© > Angular 15
β Link: https://stackblitz.com/edit/angular-2kiv4w?file=src%2Fapp%2Fhero-detail%2Fhero-detail.resolver.ts
Directive for Handle Image upload
#angular #directive
β Link: https://javascript.plainenglish.io/angular-directives-for-handle-image-upload-c3cefbfbc1a3
#angular #directive
β Link: https://javascript.plainenglish.io/angular-directives-for-handle-image-upload-c3cefbfbc1a3
Resize Observable Service in Angular
#angular #ResizeObserver
β Link: https://stackblitz.com/edit/angular-yobjsn?file=src%2Fapp%2Fapp.component.ts
#angular #ResizeObserver
β Link: https://stackblitz.com/edit/angular-yobjsn?file=src%2Fapp%2Fapp.component.ts
π2
NGRX immutability with Immer
#angular #ngrx #immer
β οΈ Third-Party Lib
β Link: https://medium.com/@daniel.glejzner/make-your-angular-ngrx-reducers-an-eye-candy-using-fantastic-library-f4ac41aea6af
#angular #ngrx #immer
β οΈ Third-Party Lib
β Link: https://medium.com/@daniel.glejzner/make-your-angular-ngrx-reducers-an-eye-candy-using-fantastic-library-f4ac41aea6af
Canceling Requests in JS...TS
#js #fetch #AbortController
β Link: https://javascript.plainenglish.io/best-practices-for-using-abortcontroller-87892b72d07e
#js #fetch #AbortController
β Link: https://javascript.plainenglish.io/best-practices-for-using-abortcontroller-87892b72d07e
Canceling DOM Events
#js #addEventListener #AbortController
β Link: https://javascript.plainenglish.io/best-practices-for-using-abortcontroller-87892b72d07e
#js #addEventListener #AbortController
β Link: https://javascript.plainenglish.io/best-practices-for-using-abortcontroller-87892b72d07e
Table Sort Directive in Angular
#angular #directive
β Link: https://stackblitz.com/edit/angular-sz9lie?file=src%2Fapp%2Ftable-sort.directive.ts
#angular #directive
β Link: https://stackblitz.com/edit/angular-sz9lie?file=src%2Fapp%2Ftable-sort.directive.ts
Terminating Promise
#js #promise #AbortController
β Link: https://javascript.plainenglish.io/best-practices-for-using-abortcontroller-87892b72d07e
#js #promise #AbortController
β Link: https://javascript.plainenglish.io/best-practices-for-using-abortcontroller-87892b72d07e