Fix for sm-dropdown doesn't appear to update on model change #7 Bug

Added a timeout in smDropdown to fix the issue.

Author: ds2co

angular-semantic-ui.js

@@ -1402,8 +1402,8 @@
     }]);
   });
 
-  app.directive('smDropdown', ['SemanticUI',
-  function SemanticDropdown(SemanticUI) 
+  app.directive('smDropdown', ['SemanticUI', '$timeout',
+  function SemanticDropdown(SemanticUI, $timeout)
   {
     return {
 
@@ -1508,33 +1508,28 @@
           });
         };
       },
-      link: function(scope, element, attributes) 
-      {
-        var applyValue = function( value )
-        {
-          if ( element.dropdown('is multiple') )
-          {
-            if ( value instanceof Array )
-            {
-              var translatedValue = [];
-
-              for (var i = 0; i < value.length; i++)
-              {
-                var translated = scope.translateValue( value[ i ] );
-
-                if ( angular.isDefined( translated ) )
-                {
-                  translatedValue.push( translated );
+      link: function (scope, element, attributes) {
+        var applyValue = function (value) {
+          $timeout(function () {
+            if (element.dropdown('is multiple')) {
+              if (value instanceof Array) {
+                var translatedValue = [];
+
+                for (var i = 0; i < value.length; i++) {
+                  var translated = scope.translateValue(value[ i ]);
+
+                  if (angular.isDefined(translated)) {
+                    translatedValue.push(translated);
+                  }
                 }
-              }
 
-              element.dropdown( 'set exactly', translatedValue );
+                element.dropdown('set exactly', translatedValue);
+              }
             }
-          }
-          else
-          {
-            element.dropdown( 'set selected', scope.translateValue( value ) );
-          }
+            else {
+              element.dropdown('set selected', scope.translateValue(value));
+            }
+          }, 0);
         };
 
         SemanticUI.setDefaultFunction( scope, 'label', attributes, function(locals){return locals.item} );

angular-semantic-ui.min.js

@@ -38,8 +38,8 @@
     }]);
   });
 
-  app.directive('smDropdown', ['SemanticUI',
-  function SemanticDropdown(SemanticUI) 
+  app.directive('smDropdown', ['SemanticUI', '$timeout',
+  function SemanticDropdown(SemanticUI, $timeout)
   {
     return {
 
@@ -144,33 +144,28 @@
           });
         };
       },
-      link: function(scope, element, attributes) 
-      {
-        var applyValue = function( value )
-        {
-          if ( element.dropdown('is multiple') )
-          {
-            if ( value instanceof Array )
-            {
-              var translatedValue = [];
-
-              for (var i = 0; i < value.length; i++)
-              {
-                var translated = scope.translateValue( value[ i ] );
-
-                if ( angular.isDefined( translated ) )
-                {
-                  translatedValue.push( translated );
+      link: function (scope, element, attributes) {
+        var applyValue = function (value) {
+          $timeout(function () {
+            if (element.dropdown('is multiple')) {
+              if (value instanceof Array) {
+                var translatedValue = [];
+
+                for (var i = 0; i < value.length; i++) {
+                  var translated = scope.translateValue(value[ i ]);
+
+                  if (angular.isDefined(translated)) {
+                    translatedValue.push(translated);
+                  }
                 }
-              }
 
-              element.dropdown( 'set exactly', translatedValue );
+                element.dropdown('set exactly', translatedValue);
+              }
             }
-          }
-          else
-          {
-            element.dropdown( 'set selected', scope.translateValue( value ) );
-          }
+            else {
+              element.dropdown('set selected', scope.translateValue(value));
+            }
+          }, 0);
         };
 
         SemanticUI.setDefaultFunction( scope, 'label', attributes, function(locals){return locals.item} );