import { Component , Input , Output , EventEmitter , ChangeDetectionStrategy , OnChanges , SimpleChange } from '@angular/core' ; import { createSelector } from 'reselect' ; const partsInCartLookupSelector = createSelector ( ( changeRecord ) => changeRecord . partsInCart . currentValue , ( partsInCart ) => { var red = partsInCart . reduce ( ( map , part ) => ( map [ part . id ] = true ) && map , { } ) ; return red ; } ) ; @ Component ( { selector : 'parts' , template : `
        <table>
            <tr *ngFor="let part of parts">
                <td>
                    <button style="margin-right:10px;margin-bottom:3px;margin-top:3px"
                        [disabled]="partsInCartLookup[part.id]"
                        (click)="addToCart.emit(part.id)">add
                    </button>
                </td>
                <td>{{part.name}}</td>
            </tr>
        </table>
    ` , changeDetection : ChangeDetectionStrategy . OnPush } ) export class PartsView implements OnChanges { @ Input ( ) parts = [ ] ; @ Input ( ) partsInCart = [ ] ; partsInCartLookup = { } ; @ Output ( ) addToCart : EventEmitter < any > = new EventEmitter ( ) ; ngOnChanges ( changeRecord ) { this . partsInCartLookup = partsInCartLookupSelector ( changeRecord ) ; } }