diff --git a/lib/components/SideMenu/side-menu.js b/lib/components/SideMenu/side-menu.js
index 098c2cf4..5f6de191 100644
--- a/lib/components/SideMenu/side-menu.js
+++ b/lib/components/SideMenu/side-menu.js
@@ -1,6 +1,6 @@
 'use strict';
 
-import { ElementRef } from '@angular/core';
+import { ElementRef, ChangeDetectorRef } from '@angular/core';
 import { BrowserDomAdapter } from '@angular/platform-browser/src/browser/browser_adapter';
 import { global } from '@angular/core/src/facade/lang';
 
@@ -13,10 +13,11 @@ import { ScrollService, Hash, MenuService, OptionsService } from '../../services
   providers: [ScrollService, MenuService, Hash],
   styleUrls: ['./lib/components/SideMenu/side-menu.css']
 })
-@Reflect.metadata('parameters', [[SchemaManager], [ElementRef],
-  [BrowserDomAdapter], [ScrollService], [MenuService], [Hash], [OptionsService]])
+@Reflect.metadata('parameters', [[SchemaManager], [ElementRef], [BrowserDomAdapter],
+  [ScrollService], [MenuService], [Hash], [OptionsService], [ChangeDetectorRef]])
 export class SideMenu extends BaseComponent {
-  constructor(schemaMgr, elementRef, dom, scrollService, menuService, hash, optionsService) {
+  constructor(schemaMgr, elementRef, dom, scrollService,
+    menuService, hash, optionsService, detectorRef) {
     super(schemaMgr);
     this.$element = elementRef.nativeElement;
     this.dom = dom;
@@ -28,13 +29,17 @@ export class SideMenu extends BaseComponent {
     this.activeItemCaption = '';
 
     this.options = optionsService.options;
+    this.detectorRef = detectorRef;
 
-    this.menuService.changed.subscribe(this.changed.bind(this));
+    this.menuService.changed.subscribe((cat, item) => this.changed(cat, item));
   }
 
   changed(cat, item) {
     this.activeCatCaption = cat.name || '';
     this.activeItemCaption = item && item.summary || '';
+
+    //safari doesn't update bindings if not run changeDetector manually :(
+    this.detectorRef.detectChanges();
   }
 
   activateAndScroll(idx, methodIdx) {