dherges

import { Component, OnInit } from '@angular/core'
import { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms'

@Component({
  selector: 'reactive-form',
  template:
`
<form [formGroup]="myForm" (ngSubmit)="submit()">
  <div class="form-group">
    <label for="name">Name</label>

dherges

import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'
import { AbstractControl, FormArray, FormBuilder, FormControl,
  FormGroup, Validators } from '@angular/forms'

@Component({
  selector: 'nested-form',
  template:
`
<form [formGroup]="myForm" (ngSubmit)="submit()">
  <h4>Form</h4>

dherges

@Component({
  selector: 'item-control',
  template:
`
<div class="form-group row" [formGroup]="item">
  <div class="col-sm-6">
    <label [attr.for]="'name'+index">Name</label>
    <input type="text" class="form-control"
           [attr.id]="'name'+index" formControlName="name">
  </div>

dherges

@Component({
  selector: 'items-array',
  template:
`
<fieldset>
  <h6>Items</h6>
  <div *ngIf="itemsFormArray.hasError('minSum')">
    You must buy a total sum of at least {{ itemsFormArray.getError('minSum') }}.
  </div>
  <item-control

dherges

@EnableWebSecurity
public class WebSecurityConfig extends WebSecurityConfigurerAdapter {

  @Override
  protected void configure(HttpSecurity http) throws Exception {
    http
      .csrf()
        .csrfTokenRepository(CookieCsrfTokenRepository.withHttpOnlyFalse())
      .and()
      // other web security config follows ...

dherges

import { Component, NgModule, Provider, ClassProvider, FactoryProvider,
         TypeProvider, ValueProvider } from '@angular/core';

import { MyThingDoer } from './my-thing-doer.service.ts';


@NgModule({
  providers: [
    MyThingDoer,
    { provide: MyThingDoer, useClass: MyThingDoer },

dherges

https://www.webcomponents.org/polyfills

https://www.webcomponents.org/specs

---

http://x-tag.github.io/

dherges

import { CommonModule } from '@angular/common';
import { Component, ElementRef, Renderer, ViewChild } from '@angular/core';
import { ComponentFixture, TestBed, TestComponentRenderer, async, inject  } from '@angular/core/testing';
import { FooComponent } from './foo.component';

/** Test component hosting an IconComponent */
@Component({template: `<foo></foo>`})
class TestComponent {

  @ViewChild(FooComponent)

dherges

@Injectable()
export class FooGuard implements CanActivate {

  canActivate(
    next: ActivatedRouteSnapshot,
    state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean {

    return Observable.of(true);
  }

dherges

export const BAR_GUARD_TOKEN = new InjectionToken<CanActivate>('bar.guard');

export function barGuard() {

  return (next: ActivatedRouteSnapshot, state: RouterStateSnapshot):
      Observable<boolean> | Promise<boolean> | boolean => {

    return Observable.of(true);
  }
}