diff --git a/hello-greeter/business-card.js b/hello-greeter/business-card.js new file mode 100644 index 0000000..c109914 --- /dev/null +++ b/hello-greeter/business-card.js @@ -0,0 +1,31 @@ +(function () { + window.customElements.define('business-card', + class extends HTMLElement { + connectedCallback() { + this.render(); + } + render() { + this.innerHTML = `
+

${this.name}

+

${this.email}

+
` + } + + static get observedAttributes() { + return ['']; + } + set name(val) { + this.setAttribute('name', val); + } + get name() { + return this.getAttribute('name'); + } + set email(val) { + this.setAttribute('email', val); + } + get email() { + return this.getAttribute('email'); + } + + }); +})(); diff --git a/hello-greeter/hello-custom-element.html b/hello-greeter/hello-custom-element.html index df5f52c..3fff52b 100644 --- a/hello-greeter/hello-custom-element.html +++ b/hello-greeter/hello-custom-element.html @@ -3,6 +3,7 @@ + @@ -10,6 +11,8 @@ + + diff --git a/projects/button-chooser/src/lib/button-chooser.component.ts b/projects/button-chooser/src/lib/button-chooser.component.ts index d6b3ddc..997707c 100644 --- a/projects/button-chooser/src/lib/button-chooser.component.ts +++ b/projects/button-chooser/src/lib/button-chooser.component.ts @@ -15,7 +15,7 @@ import {ControlValueAccessor, NG_VALUE_ACCESSOR} from '@angular/forms'; templateUrl: './button-chooser.component.html', styleUrls: ['./button-chooser.component.scss'], encapsulation: ViewEncapsulation.None, - changeDetection: ChangeDetectionStrategy.OnPush, + changeDetection: ChangeDetectionStrategy.Default, providers: [ { provide: NG_VALUE_ACCESSOR, @@ -23,13 +23,13 @@ import {ControlValueAccessor, NG_VALUE_ACCESSOR} from '@angular/forms'; multi: true, }] }) -export class ButtonChooserComponent implements ControlValueAccessor { +export class ButtonChooserComponent implements ControlValueAccessor, OnChanges { constructor() { - } @Input() choices: string[] = []; + @Input() choicesString: string; @Input() value: any; @Output() valueChanged = new EventEmitter(); @@ -37,6 +37,12 @@ export class ButtonChooserComponent implements ControlValueAccessor { private propagateChange = Function.prototype; private propagateTouched = Function.prototype; + ngOnChanges(changes: SimpleChanges) { + if (changes.choicesString) { + this.choices = changes.choicesString.currentValue.split(','); + } + } + public writeValue(value: any) { this.value = value; }