diff --git a/demo/src/app/components/+alerts/alerts-section.component.html b/demo/src/app/components/+alerts/alerts-section.component.html
index baff6afa23..8926347d67 100644
--- a/demo/src/app/components/+alerts/alerts-section.component.html
+++ b/demo/src/app/components/+alerts/alerts-section.component.html
@@ -60,7 +60,7 @@ <h3 routerLink="." fragment="additional-content" id="additional-content">Additio
 
   <!-- dismiss -->
   <h3 routerLink="." fragment="dismissing" id="dismissing">Dismissing</h3>
-  <p>Alerts have <code>dismiss</code> option. Enabling it will show close button
+  <p>Alerts have <code>dismissible</code> option. Enabling it will show close button
     to the right of the alert.</p>
   <ng-sample-box [ts]="demos.dismiss.component" [html]="demos.dismiss.html">
     <demo-alert-dismiss></demo-alert-dismiss>
diff --git a/demo/src/app/components/+alerts/demos/dismiss/dismiss.html b/demo/src/app/components/+alerts/demos/dismiss/dismiss.html
index 55929b9e90..333074fae7 100644
--- a/demo/src/app/components/+alerts/demos/dismiss/dismiss.html
+++ b/demo/src/app/components/+alerts/demos/dismiss/dismiss.html
@@ -1,4 +1,4 @@
 <div *ngFor="let alert of alerts">
-  <alert [type]="alert.type" dismissible="true">{{ alert.msg }}</alert>
+  <alert [type]="alert.type" [dismissible]="true">{{ alert.msg }}</alert>
 </div>
 <button type="button" class="btn btn-primary" (click)="reset()">Reset</button>
diff --git a/demo/src/app/components/+dropdown/dropdown-section.component.html b/demo/src/app/components/+dropdown/dropdown-section.component.html
index 32ceb01532..69446a1100 100644
--- a/demo/src/app/components/+dropdown/dropdown-section.component.html
+++ b/demo/src/app/components/+dropdown/dropdown-section.component.html
@@ -13,7 +13,7 @@ <h2>Contents</h2>
         <li><a routerLink="." fragment="alignment">Menu alignment</a></li>
         <li><a routerLink="." fragment="nested">Nested dropdowns (experimental)</a></li>
         <li><a routerLink="." fragment="container-body">Append to body</a></li>
-        <li><a routerLink="." fragment="keyboard">Single button with keyboard nav</a></li>
+        <!--<li><a routerLink="." fragment="keyboard">Single button with keyboard nav</a></li>-->
         <li><a routerLink="." fragment="dropup">Dropup variation</a></li>
         <li><a routerLink="." fragment="config">Configuring defaults</a></li>
       </ul>
diff --git a/demo/src/app/components/+modal/demos/nested/nested.html b/demo/src/app/components/+modal/demos/nested/nested.html
index f10b886838..78cd81f0bb 100644
--- a/demo/src/app/components/+modal/demos/nested/nested.html
+++ b/demo/src/app/components/+modal/demos/nested/nested.html
@@ -25,7 +25,7 @@ <h4 class="modal-title pull-left">Second modal</h4>
         </button>
       </div>
       <div class="modal-body">
-        This is static modal <br>
+        This is second modal <br>
         <button type="button" class="btn btn-primary" (click)="thirdModal.show()">Open third modal</button>
       </div>
     </div>
@@ -42,7 +42,7 @@ <h4 class="modal-title pull-left">Third modal</h4>
         </button>
       </div>
       <div class="modal-body">
-        This is static modal <br>
+        This is third modal <br>
         Click <b>&times;</b> to close modal.
       </div>
     </div>
diff --git a/demo/src/app/components/+pagination/demos/pager/pager.html b/demo/src/app/components/+pagination/demos/pager/pager.html
index da2f3711a0..3a728c46a9 100644
--- a/demo/src/app/components/+pagination/demos/pager/pager.html
+++ b/demo/src/app/components/+pagination/demos/pager/pager.html
@@ -14,7 +14,7 @@
       [(ngModel)]="currentPage"
       (pageChanged)="pageChanged($event)"
       pageBtnClass="btn"
-      itemsPerPage="10"
+      [itemsPerPage]="10"
       class="pull-left">
     </pager>
   </div>
diff --git a/demo/src/app/components/+pagination/demos/styling-global/styling-global.html b/demo/src/app/components/+pagination/demos/styling-global/styling-global.html
index b3ea5574f4..f8944d82d8 100644
--- a/demo/src/app/components/+pagination/demos/styling-global/styling-global.html
+++ b/demo/src/app/components/+pagination/demos/styling-global/styling-global.html
@@ -4,6 +4,6 @@
 </div>
 
 <div class="col-md-6">
-  <pager [totalItems]="totalItems" [(ngModel)]="currentPage" (pageChanged)="pageChanged($event)" itemsPerPage="10"
+  <pager [totalItems]="totalItems" [(ngModel)]="currentPage" (pageChanged)="pageChanged($event)" [itemsPerPage]="10"
          pageBtnClass="btn-custom"></pager>
 </div>
diff --git a/demo/src/app/components/+progressbar/demos/bs3/config/config.html b/demo/src/app/components/+progressbar/demos/bs3/config/config.html
index f96f5ff5d7..b9b4fe7306 100644
--- a/demo/src/app/components/+progressbar/demos/bs3/config/config.html
+++ b/demo/src/app/components/+progressbar/demos/bs3/config/config.html
@@ -1 +1 @@
-<progressbar class="progress-striped active"  value="136" type="danger"><i>136 / 150</i></progressbar>
+<progressbar class="progress-striped active"  [value]="136" type="danger"><i>136 / 150</i></progressbar>
diff --git a/demo/src/app/components/+progressbar/demos/bs3/stacked/stacked.html b/demo/src/app/components/+progressbar/demos/bs3/stacked/stacked.html
index f77f8be06a..3a69f9e586 100644
--- a/demo/src/app/components/+progressbar/demos/bs3/stacked/stacked.html
+++ b/demo/src/app/components/+progressbar/demos/bs3/stacked/stacked.html
@@ -1,5 +1,5 @@
 <div class="row col-lg-12">
-  <progressbar class="progress" [value]="stacked" max="100"></progressbar>
+  <progressbar class="progress" [value]="stacked" [max]="100"></progressbar>
 </div>
 <br>
 <div class="row col-md-12">
diff --git a/demo/src/app/components/+progressbar/demos/bs3/static/static.html b/demo/src/app/components/+progressbar/demos/bs3/static/static.html
index f17d15fae3..eae9c6b83e 100644
--- a/demo/src/app/components/+progressbar/demos/bs3/static/static.html
+++ b/demo/src/app/components/+progressbar/demos/bs3/static/static.html
@@ -1,11 +1,11 @@
 <div class="row">
   <div class="col-sm-4">
-    <progressbar value="55"></progressbar>
+    <progressbar [value]="55"></progressbar>
   </div>
   <div class="col-sm-4">
-    <progressbar class="progress-striped" value="22" type="warning">22%</progressbar>
+    <progressbar class="progress-striped" [value]="22" type="warning">22%</progressbar>
   </div>
   <div class="col-sm-4">
-    <progressbar class="progress-striped active" max="200" value="166" type="danger"><i>166 / 200</i></progressbar>
+    <progressbar class="progress-striped active" max="200" [value]="166" type="danger"><i>166 / 200</i></progressbar>
   </div>
 </div>
diff --git a/demo/src/app/components/+progressbar/demos/bs4/dynamic/dynamic.html b/demo/src/app/components/+progressbar/demos/bs4/dynamic/dynamic.html
index dd5feec73e..2c396b4d89 100644
--- a/demo/src/app/components/+progressbar/demos/bs4/dynamic/dynamic.html
+++ b/demo/src/app/components/+progressbar/demos/bs4/dynamic/dynamic.html
@@ -9,5 +9,5 @@
 <progressbar class="progress progress-striped progress-animated" [value]="dynamic" [max]="max" [type]="type">
   {{type}} <i *ngIf="showWarning">!!! Watch out !!!</i>
 </progressbar>
-
+<br>
 <button type="button" class="btn btn-sm btn-primary" (click)="random()">Randomize</button>
diff --git a/demo/src/app/components/+progressbar/demos/bs4/stacked/stacked.html b/demo/src/app/components/+progressbar/demos/bs4/stacked/stacked.html
index 0aa0822faa..340970f7ea 100644
--- a/demo/src/app/components/+progressbar/demos/bs4/stacked/stacked.html
+++ b/demo/src/app/components/+progressbar/demos/bs4/stacked/stacked.html
@@ -1,5 +1,5 @@
 <div class="row col-lg-12">
-  <progressbar class="progress" [value]="stacked" max="100"></progressbar>
+  <progressbar class="progress" [value]="stacked" [max]="100"></progressbar>
 </div>
 <br>
 <div class="row col-md-12">
diff --git a/demo/src/app/components/+progressbar/demos/bs4/static/static.html b/demo/src/app/components/+progressbar/demos/bs4/static/static.html
index 0bd129fedd..434ebaa9fc 100644
--- a/demo/src/app/components/+progressbar/demos/bs4/static/static.html
+++ b/demo/src/app/components/+progressbar/demos/bs4/static/static.html
@@ -1,11 +1,11 @@
 <div class="row">
   <div class="col-sm-4">
-    <progressbar class="progress" value="55" max="100"></progressbar>
+    <progressbar class="progress" [value]="55" [max]="100"></progressbar>
   </div>
   <div class="col-sm-4">
-    <progressbar class="progress progress-striped" value="22" max="100" type="warning">22%</progressbar>
+    <progressbar class="progress progress-striped" [value]="22" [max]="100" type="warning">22%</progressbar>
   </div>
   <div class="col-sm-4">
-    <progressbar class="progress progress-striped active" max="200" value="166" type="danger"><i>166 / 200</i></progressbar>
+    <progressbar class="progress progress-striped active" [max]="200" [value]="166" type="danger"><i>166 / 200</i></progressbar>
   </div>
 </div>
diff --git a/demo/src/app/components/+rating/demos/custom/custom.html b/demo/src/app/components/+rating/demos/custom/custom.html
index c071783ef1..fc722f60b3 100644
--- a/demo/src/app/components/+rating/demos/custom/custom.html
+++ b/demo/src/app/components/+rating/demos/custom/custom.html
@@ -1,11 +1,11 @@
 <div>
-  <rating max="10" [(ngModel)]="x" [customTemplate]="t" style="color: #0275d8;font-size: 20px;"></rating>
+  <rating [max]="10" [(ngModel)]="x" [customTemplate]="t" style="color: #0275d8;font-size: 20px;"></rating>
   <b>(<i>Rate:</i> {{x}})</b>
   <ng-template #t let-index="index" let-value="value">{{index < value ? '&#9745;' : '&#9744;'}}</ng-template>
 </div>
 
 <div>
-  <rating max="10" [(ngModel)]="y" [customTemplate]="tt"></rating>
+  <rating [max]="10" [(ngModel)]="y" [customTemplate]="tt"></rating>
   <b>(<i>Rate:</i> {{y}})</b>
   <ng-template #tt let-i="index" let-v="value">
     <button class="btn btn-{{i < v ? 'warning' : 'default'}}">
diff --git a/demo/src/app/components/+tabs/demos/manual/manual.html b/demo/src/app/components/+tabs/demos/manual/manual.html
index eb56365074..5bd376c041 100644
--- a/demo/src/app/components/+tabs/demos/manual/manual.html
+++ b/demo/src/app/components/+tabs/demos/manual/manual.html
@@ -14,7 +14,7 @@
     <tab heading="Static title">Static content</tab>
     <tab heading="Static Title 1">Static content 1</tab>
     <tab heading="Static Title 2">Static content 2</tab>
-    <tab heading="Static Title 3" removable="true">Static content 3</tab>
+    <tab heading="Static Title 3" [removable]="true">Static content 3</tab>
   </tabset>
 </div>
 
diff --git a/demo/src/app/components/+typeahead/demos/async/async.html b/demo/src/app/components/+typeahead/demos/async/async.html
index fe67fb7745..4b4aff01e8 100644
--- a/demo/src/app/components/+typeahead/demos/async/async.html
+++ b/demo/src/app/components/+typeahead/demos/async/async.html
@@ -4,7 +4,7 @@
          (typeaheadLoading)="changeTypeaheadLoading($event)"
          (typeaheadNoResults)="changeTypeaheadNoResults($event)"
          (typeaheadOnSelect)="typeaheadOnSelect($event)"
-         typeaheadOptionsLimit="7"
+         [typeaheadOptionsLimit]="7"
          typeaheadOptionField="name"
          placeholder="Locations loaded with timeout"
          class="form-control">
diff --git a/demo/src/app/components/+typeahead/demos/in-form/in-form.html b/demo/src/app/components/+typeahead/demos/in-form/in-form.html
index 2032c57b23..be305c2b5c 100644
--- a/demo/src/app/components/+typeahead/demos/in-form/in-form.html
+++ b/demo/src/app/components/+typeahead/demos/in-form/in-form.html
@@ -3,8 +3,8 @@
 <form [formGroup]="myForm">
   <input formControlName="state"
          [typeahead]="states"
-         typeaheadOptionsLimit="7"
-         typeaheadMinLength="0"
+         [typeaheadOptionsLimit]="7"
+         [typeaheadMinLength]="0"
          placeholder="Typeahead inside a form"
          class="form-control">
 </form>