@codebakery/origami
Advanced tools
Changelog
1.3.0-beta.0 (2017-07-24)
With this release, the SystemJS loader is now supported by Origami!
Polymer templates now support both event and data binding.
@Component({
selector: 'paper-grid',
template: `
<vaadin-grid [items]="items">
<vaadin-grid-selection-column [(selectAll)]="selectAll">
<template class="header" ngNonBindable [polymer]="this">
<!-- Polymer will bind "selectAll" to the host, which is set to "this" -->
<paper-checkbox checked="{{selectAll}}"></paper-checkbox>
</template>
<template ngNonBindable>
<paper-checkbox checked="{{selected}}></paper-checkbox>
</template>
</vaadin-grid-selection-column>
<vaadin-grid-column>
<template class="header" ngNonBindable>
<div>Number</div>
</template>
<template ngNonBindable>
<!-- Normal event bindings will continue to call the Angular host method -->
<div class="cell" on-click="onClick">[[item]]</div>
</template>
</vaadin-grid-column>
</vaadin-grid>
`
})
export class PaperGridComponent {
@PolymerChanges()
selectAll: boolean;
items = [1, 2, 3];
onClick(e) {
alert('Clicked Number ' + e.model.item);
}
}
Origami's collection libraries should be imported from @codebakery/origami/collections
. The old @codebakery/origami/lib/collections
import path will continue to work but will be removed in the next major revision.
<a name="1.2.3"></a>
Changelog
1.2.1 (2017-06-09)
<a name="1.2.0"></a>
Changelog
1.2.0 (2017-06-08)
CustomStyleService
has been deprecated in favor of PolymerDomSharedStyles
and will be removed in 2.0.0.
A warning will be given when using CustomStyleService.updateCustomStyles()
. Remove it and import PolymerModule.forRoot()
in your application's root module to enable the new automatic custom style handling.
<a name="1.1.2"></a>
Changelog
1.1.0 (2017-05-04)
webcomponentsjs 1.0.0-rc.11 added window.WebComponents
to indicate whether or not polyfills are being loaded. To take advantage of this and reduce complexity, Origami provides webcomponentsReady()
. Instead of adding listeners for WebComponentsReady, just bootstrap the app when the function resolves.
Before:
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
function bootstrap() {
platformBrowserDynamic().bootstrapModule(AppModule);
}
if (window.webcomponentsReady) {
bootstrap();
} else {
window.addEventListener('WebComponentsReady', bootstrap);
}
After:
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { webcomponentsReady } from '@codebakery/origami';
webcomponentsReady().then(() => {
platformBrowserDynamic().bootstrapModule(AppModule);
});
Make sure you update webcomponentsjs! Either explicitly install it, or remove bower_components
and reinstall to get the latest version.
<a name="1.0.1"></a>