Error with nouislider

[koushikmln]

angular.module("ui.materialize.nouislider", [])
        .directive("nouislider", ["$timeout", function($timeout){
            return {
                restrict: 'A',
                scope: {
                    ngModel: '=',
                    min: '@',
                    max: '@',
                    step: '@?',
                    connect: '@?',
                    tooltips: '@?',
                    behaviour: '@?'
                },
                link: function (scope, element, attrs) {
                    var modelIsArray = false;

                    var watchNgModel = scope.$watch('ngModel', function(newValue) {
                        if (newValue !== undefined) {
                            createNoUiSlider();
                            watchNgModel();
                        }
                    });

                    element[0].noUiSlider.on('update', function(values, input) {
                        $timeout(function() {
                            scope.ngModel = modelIsArray ? values : values[0];
                        });
                    });

                    function **createNoUiSlider**() {
                        if (angular.isArray(scope.ngModel)) {
                            modelIsArray = true;
                        }

                        noUiSlider.create(element[0], {
                            start: scope.ngModel || 0,
                            step: parseFloat(scope.step || 1),
                            tooltips: angular.isDefined(scope.tooltips) ? scope.tooltips : undefined,
                            connect: angular.isDefined(scope.connect) ? scope.connect : [false, false],
                            behaviour: angular.isDefined(scope.behaviour) ? scope.behaviour : undefined,
                            range: {
                                'min': parseFloat(scope.min || 0),
                                'max': parseFloat(scope.max || 100),
                            },
                            format: {
                                to: function (number) {
                                    return Math.round(number * 100) / 100;
                                },
                                from: function (number) {
                                    return Number(number);
                                }
                            }
                        });

                        function getConnection(value) {
                            value.toLowerCase();

                            if ('true' === value || 'false' === value) {
                                return JSON.parse(value);
                            }

                            return value;
                        }
                    };
                }
            };
        }]);

the createnouislider method is not firing. its giving an error on the update event which is giving an undefined.

[koushikmln]

it started working when i moved the update listener inside the createnouislider method. Also the connect variable was giving error so i just made it true for it to work. Might be a versioning issue. This is the final working code:

angular.module("ui.materialize.nouislider", [])
        .directive("nouislider", ["$timeout", function($timeout){
            return {
                restrict: 'A',
                scope: {
                    ngModel: '=',
                    min: '@',
                    max: '@',
                    step: '@?',
                    connect: '@?',
                    tooltips: '@?',
                    behaviour: '@?'
                },
                link: function (scope, element, attrs) {
                    var modelIsArray = false;

                    var watchNgModel = scope.$watch('ngModel', function(newValue) {
                        if (newValue !== undefined) {
                            createNoUiSlider();
                            watchNgModel();
                        }
                    });

                    function createNoUiSlider() {
                        if (angular.isArray(scope.ngModel)) {
                            modelIsArray = true;
                        }

                        noUiSlider.create(element[0], {
                            start: scope.ngModel || 0,
                            step: parseFloat(scope.step || 1),
                            tooltips: angular.isDefined(scope.tooltips) ? scope.tooltips : undefined,
                            connect: true,
                            behaviour: angular.isDefined(scope.behaviour) ? scope.behaviour : undefined,
                            range: {
                                'min': parseFloat(scope.min || 0),
                                'max': parseFloat(scope.max || 100),
                            },
                            format: {
                                to: function (number) {
                                    return Math.round(number * 100) / 100;
                                },
                                from: function (number) {
                                    return Number(number);
                                }
                            }
                        });
                        element[0].noUiSlider.on('update', function(values, input) {
                            $timeout(function() {
                                scope.ngModel = modelIsArray ? values : values[0];
                            });
                        });
                        function getConnection(value) {
                            value.toLowerCase();

                            if ('true' === value || 'false' === value) {
                                return JSON.parse(value);
                            }

                            return value;
                        }
                    };
                }
            };
        }]);`