[[vaadin-core-elements.angular2]]
= Angular 2 Integration
-While Vaadin Elements are built using Polymer, you need [vaadin-ng2-polymer] directive to enable seamless usage within Angular 2 applications.
+While Vaadin Elements are built using Polymer, you need https://github.com/vaadin/angular2-polymer[@vaadin/angular2-polymer] directive to enable seamless usage within Angular 2 applications.
This page assumes that you already have an Angular 2 application setup ready.
[source,bash]
----
-npm install vaadin/vaadin-ng2-polymer
+npm install @vaadin/angular2-polymer
----
Although Angular 2 dependecies are typically installed via npm, Vaadin Elements require installation with http://bower.io[Bower].
== Importing
-
-
-Import the polymer directive as follows.
+Import the Polymer directive as follows.
[source,javascript]
----
-import { PolymerElement } from '../node_modules/vaadin-ng2-polymer/polymer-element';
+import { PolymerElement } from '../node_modules/@vaadin/angular2-polymer/polymer-element';
----
Your Angular 2 component also needs to declare the usage of the directive.
[source]
----
-<vaadin-grid #grid [items]="dataItems">
+<vaadin-grid #grid>
<table>
<colgroup>
<col>
ngAfterViewInit() {
this.grid.nativeElement.then(() => {
- ...
+ // Some code to configure the grid.
});
}
----