diff --git a/README.md b/README.md
index a88878c..e4dfd67 100644
--- a/README.md
+++ b/README.md
@@ -23,18 +23,34 @@ Simple angular directive for jquery [nouislider](http://refreshless.com/nouislid
 angular.module('MyApp', ['nouislider']);
 ```
 
+- Define a the slider model in your controller.
+
+```js
+$scope.test = {
+    range: {
+        min: 0,
+        '50%': [10,10],
+        max: 100
+    },
+    selected: {
+        from: 3,
+        to: 6
+    }
+};
+```
+
 - Add a `slider` attribute to your `<div>` tag:
 
 ```html
-<div slider ng-model="test.single" start=1 end=10></div>
-<div slider ng-from="test.from" ng-to="test.to" start=0 end=100 step=5></div>
+<div slider ng-model="test.single" range="test.range"></div>
+<div slider ng-from="test.selected.from" ng-to="test.selected.to" range="test.range" step=5></div>
 ```
 
 - If you wanna change [callback function](http://refreshless.com/nouislider/slider-events), use `callback` attribute. (`slide` by default.)
 
 ```html
-<div slider ng-model="test.single" start=1 end=10 callback='change'></div>
-<div slider ng-from="test.from" ng-to="test.to" start=0 end=100 step=5 callback='set'></div>
+<div slider ng-model="test.single" range="test.range" callback='change'></div>
+<div slider ng-from="test.from" ng-to="test.to" range="test.range" step=5 callback='set'></div>
 ```
 
 That's it!
diff --git a/app/scripts/app.coffee b/app/scripts/app.coffee
index 9f913ca..7678d64 100644
--- a/app/scripts/app.coffee
+++ b/app/scripts/app.coffee
@@ -4,9 +4,9 @@ angular.module('nouislider', [])
   .directive "slider", () ->
     restrict: "A"
     scope:
-      start: "@"
+      range: "="
       step: "@"
-      end: "@"
+      connect: "@"
       callback: "@"
       margin: "@"
       ngModel: "="
@@ -22,14 +22,16 @@ angular.module('nouislider', [])
         fromParsed = null
         toParsed = null
 
-        slider.noUiSlider
-          start: [scope.ngFrom or scope.start, scope.ngTo or scope.end]
+        sliderConfig =
+          start: [scope.ngFrom or scope.range.min, scope.ngTo or scope.range.max]
           step: parseFloat(scope.step or 1)
           connect: true
-          margin: parseFloat(scope.margin or 0)
-          range:
-            min: [parseFloat scope.start]
-            max: [parseFloat scope.end]
+          range: scope.range
+
+        if scope.margin
+          sliderConfig['margin'] = scope.margin
+
+        slider.noUiSlider(sliderConfig)
 
 
         slider.on callback, ->
@@ -54,13 +56,15 @@ angular.module('nouislider', [])
         )
       else
         parsedValue = null
-
-        slider.noUiSlider
-          start: [scope.ngModel or scope.start],
+        sliderConfig =
+          start: [scope.ngModel or scope.range.min]
           step: parseFloat(scope.step or 1)
-          range:
-            min: [parseFloat scope.start]
-            max: [parseFloat scope.end]
+          range: scope.range
+
+        if scope.connect
+          sliderConfig['connect'] = scope.connect
+
+        slider.noUiSlider(sliderConfig)
 
         slider.on callback, ->
           parsedValue = parseFloat slider.val()
diff --git a/bower.json b/bower.json
index c1edf2f..53d45bd 100644
--- a/bower.json
+++ b/bower.json
@@ -1,7 +1,7 @@
 {
   "name": "angular-nouislider",
   "homepage": "http://vasyabigi.github.io/angular-nouislider/",
-  "version": "0.3.1",
+  "version": "0.3.2",
   "main": "src/nouislider.js",
   "ignore": [
     "app"
diff --git a/src/nouislider.js b/src/nouislider.js
index d9afa6c..6af26f0 100644
--- a/src/nouislider.js
+++ b/src/nouislider.js
@@ -3,9 +3,9 @@ angular.module('nouislider', []).directive('slider', function () {
   return {
     restrict: 'A',
     scope: {
-      start: '@',
+      range: '=',
       step: '@',
-      end: '@',
+      connect: '@',
       callback: '@',
       margin: '@',
       ngModel: '=',
@@ -13,25 +13,25 @@ angular.module('nouislider', []).directive('slider', function () {
       ngTo: '='
     },
     link: function (scope, element, attrs) {
-      var callback, fromParsed, parsedValue, slider, toParsed;
+      var callback, fromParsed, parsedValue, slider, sliderConfig, toParsed;
       slider = $(element);
       callback = scope.callback ? scope.callback : 'slide';
       if (scope.ngFrom != null && scope.ngTo != null) {
         fromParsed = null;
         toParsed = null;
-        slider.noUiSlider({
+        sliderConfig = {
           start: [
-            scope.ngFrom || scope.start,
-            scope.ngTo || scope.end
+            scope.ngFrom || scope.range.min,
+            scope.ngTo || scope.range.max
           ],
           step: parseFloat(scope.step || 1),
           connect: true,
-          margin: parseFloat(scope.margin || 0),
-          range: {
-            min: [parseFloat(scope.start)],
-            max: [parseFloat(scope.end)]
-          }
-        });
+          range: scope.range
+        };
+        if (scope.margin) {
+          sliderConfig['margin'] = scope.margin;
+        }
+        slider.noUiSlider(sliderConfig);
         slider.on(callback, function () {
           var from, to, _ref;
           _ref = slider.val(), from = _ref[0], to = _ref[1];
@@ -60,14 +60,15 @@ angular.module('nouislider', []).directive('slider', function () {
         });
       } else {
         parsedValue = null;
-        slider.noUiSlider({
-          start: [scope.ngModel || scope.start],
+        sliderConfig = {
+          start: [scope.ngModel || scope.range.min],
           step: parseFloat(scope.step || 1),
-          range: {
-            min: [parseFloat(scope.start)],
-            max: [parseFloat(scope.end)]
-          }
-        });
+          range: scope.range
+        };
+        if (scope.connect) {
+          sliderConfig['connect'] = scope.connect;
+        }
+        slider.noUiSlider(sliderConfig);
         slider.on(callback, function () {
           parsedValue = parseFloat(slider.val());
           return scope.$apply(function () {
@@ -82,4 +83,6 @@ angular.module('nouislider', []).directive('slider', function () {
       }
     }
   };
-});
\ No newline at end of file
+});  /*
+//@ sourceMappingURL=app.js.map
+*/
\ No newline at end of file
diff --git a/src/nouislider.min.js b/src/nouislider.min.js
index 19db5ca..3337212 100644
--- a/src/nouislider.min.js
+++ b/src/nouislider.min.js
@@ -1 +1 @@
-"use strict";angular.module("nouislider",[]).directive("slider",function(){return{restrict:"A",scope:{start:"@",step:"@",end:"@",callback:"@",margin:"@",ngModel:"=",ngFrom:"=",ngTo:"="},link:function(a,b){var c,d,e,f,g;return f=$(b),c=a.callback?a.callback:"slide",null!=a.ngFrom&&null!=a.ngTo?(d=null,g=null,f.noUiSlider({start:[a.ngFrom||a.start,a.ngTo||a.end],step:parseFloat(a.step||1),connect:!0,margin:parseFloat(a.margin||0),range:{min:[parseFloat(a.start)],max:[parseFloat(a.end)]}}),f.on(c,function(){var b,c,e;return e=f.val(),b=e[0],c=e[1],d=parseFloat(b),g=parseFloat(c),a.$apply(function(){return a.ngFrom=d,a.ngTo=g})}),a.$watch("ngFrom",function(a){return a!==d?f.val([a,null]):void 0}),a.$watch("ngTo",function(a){return a!==g?f.val([null,a]):void 0})):(e=null,f.noUiSlider({start:[a.ngModel||a.start],step:parseFloat(a.step||1),range:{min:[parseFloat(a.start)],max:[parseFloat(a.end)]}}),f.on(c,function(){return e=parseFloat(f.val()),a.$apply(function(){return a.ngModel=e})}),a.$watch("ngModel",function(a){return a!==e?f.val(a):void 0}))}}});
\ No newline at end of file
+"use strict";angular.module("nouislider",[]).directive("slider",function(){return{restrict:"A",scope:{range:"=",step:"@",connect:"@",callback:"@",margin:"@",ngModel:"=",ngFrom:"=",ngTo:"="},link:function(a,b){var c,d,e,f,g,h;return f=$(b),c=a.callback?a.callback:"slide",null!=a.ngFrom&&null!=a.ngTo?(d=null,h=null,g={start:[a.ngFrom||a.range.min,a.ngTo||a.range.max],step:parseFloat(a.step||1),connect:!0,range:a.range},a.margin&&(g.margin=a.margin),f.noUiSlider(g),f.on(c,function(){var b,c,e;return e=f.val(),b=e[0],c=e[1],d=parseFloat(b),h=parseFloat(c),a.$apply(function(){return a.ngFrom=d,a.ngTo=h})}),a.$watch("ngFrom",function(a){return a!==d?f.val([a,null]):void 0}),a.$watch("ngTo",function(a){return a!==h?f.val([null,a]):void 0})):(e=null,g={start:[a.ngModel||a.range.min],step:parseFloat(a.step||1),range:a.range},a.connect&&(g.connect=a.connect),f.noUiSlider(g),f.on(c,function(){return e=parseFloat(f.val()),a.$apply(function(){return a.ngModel=e})}),a.$watch("ngModel",function(a){return a!==e?f.val(a):void 0}))}}});
\ No newline at end of file