Skip to content

Instantly share code, notes, and snippets.

View peterbsmyth's full-sized avatar

Peter B Smith peterbsmyth

View GitHub Profile
import { Injectable } from '@angular/core';
import { Actions, Effect, ofType } from '@ngrx/effects';
import { Action } from '@ngrx/store';
import { Post } from './post.model';
import { PostActions, PostActionTypes, LoadPosts, LoadPostsComplete } from './post.actions';
import { Observable } from 'rxjs/Observable';
import {
map,
switchMap,
import { Component, OnInit } from '@angular/core';
import { Store } from '@ngrx/store';
import { LoadPosts } from './post.actions';
import * as fromRoot from './reducers';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
@peterbsmyth
peterbsmyth / post.actions.ts
Created March 25, 2018 01:20
post.actions.ts
import { Action } from '@ngrx/store';
import { Update } from '@ngrx/entity';
import { Post } from './post.model';
export enum PostActionTypes {
LoadPosts = '[Post] Load Posts',
LoadPostsComplete = '[Post] Load Posts Complete',
}
export class LoadPosts implements Action {
import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
@Injectable()
export class ApiService {
constructor(
private http: HttpClient
) { }
[
{
"pillar": "WORK",
"event_date": "2018-02-11 00:00:00"
},
{
"pillar": "LEARN",
"event_date": "2018-02-11 00:00:00"
},
{
<StackLayout *ngFor="let photo of state.photos" style="margin: 10">
<Image [src]='photo' height="200"></Image>
</StackLayout>

ngRx Recipe

Update Many nested Models

Scenario

Given two models: quote and chapter where:

interface Quote {
  id: string;
  text: string;
 chapter: Chapter;

The Rhetoric of The Wire: "The Target"

Thank You For Arguing + The Wire

Scene

Lt. Daniels
For now, we'll work out of Narcotics,
with Kima keeping the file.
We'll copy everything to Ronnie
at the courthouse and your people.

Santangelo

<?xml version="1.0" encoding="utf-8" ?>
<kml xmlns="http://www.opengis.net/kml/2.2">
<Document><Folder><name>OGRGeoJSON</name>
<Placemark>
<Style><LineStyle><color>ffffffff</color></LineStyle><PolyStyle><fill>1</fill></PolyStyle></Style>
<ExtendedData><SchemaData schemaUrl="#OGRGeoJSON">
<SimpleData name="FID">1</SimpleData>
<SimpleData name="CITY_WARD">01</SimpleData>
</SchemaData></ExtendedData>
<Polygon><outerBoundaryIs><LinearRing><coordinates>-76.157591607788504,43.082751483892203 -76.156070528753304,43.081708863989 -76.155382660371899,43.082482222249403 -76.155299108446897,43.082434276365397 -76.154053385116001,43.081563394747697 -76.1529280036427,43.0824448273627 -76.151570256203598,43.0835099982881 -76.150656196686796,43.084224235144802 -76.149813755855007,43.0836407945147 -76.149155211386002,43.084150143019599 -76.148949341688905,43.084313706776904 -76.1486628938585,43.084384075360497 -76.147612026416198,43.0847151774948 -76.147441009847299,43.084769251587602 -76.147386187213797,43.084
@peterbsmyth
peterbsmyth / recipe.example.md
Last active May 21, 2020 13:39
Making chained API Calls using @ngrx/Effects

Making chained API Calls using @ngrx/Effects

Purpose

This recipe is useful for cooking up chained API calls as a result of a single action.

Description

In the below example, a single action called POST_REPO is dispatched and it's intention is to create a new repostiory on GitHub then update the README with new data after it is created.
For this to happen there are 4 API calls necessary to the GitHub API:

  1. POST a new repostiry
  2. GET the master branch of the new repository
  3. GET the files on the master branch