10月メモ・リンク集

これは何か

  • 10月に調べたことのメモ
  • 基本形式は、「参考URLとそれに関するメモとコメント」

ngrx関連

ngrxとフォーム

Introducing @ngrx/entity – @ngrx – Medium

状態のリセット

// foo.module.ts
...
StoreModule.forFeature(
  'foo',
  fromCalendar.reducers,
  {
    metaReducers: [fromFoo.resetReducer]
  }
),
...

// reducers/index.ts
export function resetReducer(reducer: ActionReducer<FooState, reset.Actions>) {
  return function (state, action) {
    if (action.type === RESET) {
      return reducer(undefined, action);
    } else {
      return reducer(state, action);
    }
  };
}

How to share state between reducers best practice · Issue #159 · ngrx/example-app · GitHub

Rx関連

unsubscribe

その他

Angular関連

view操作

ngOnInit() {
  const componentFactory = this.componentFactoryResolver.resolveComponentFactory(SpinnerComponent);
  const componentRef = componentFactory.create(this.viewContainer.injector);
  this.renderer.appendChild(
    this.viewContainer.element.nativeElement,
    componentRef.location.nativeElement
  );
}

フォーム

export class ChildComponent implements OnInit {
  ...
  @ViewChild("model") ngModel: NgModel;

  ngOnInit() {
    this.parentForm.addControl(this.ngModel); // <== add this
    this.parentForm.valueChanges.subscribe(changes => {
      console.log(JSON.stringify(changes));
    });
  }
}

その他

null vs undefined

TypeScript