Merge pull request #135 from angular-ui/fix-check-isempty

Show placeholder correctly when model is empty

Author: dimirc

src/bootstrap/match.tpl.html

@@ -3,7 +3,7 @@
         ng-disabled="$select.disabled"
         ng-class="{'btn-default-focus':$select.focus}";
         ng-click="$select.activate()">
-  <span ng-hide="$select.selected !== undefined" class="text-muted">{{$select.placeholder}}</span>
-  <span ng-show="$select.selected !== undefined" ng-transclude></span>
+  <span ng-show="$select.isEmpty()" class="text-muted">{{$select.placeholder}}</span>
+  <span ng-hide="$select.isEmpty()" ng-transclude></span>
   <span class="caret"></span>
 </button>

src/select.js

@@ -110,6 +110,10 @@
     ctrl.resetSearchInput = undefined; // Initialized inside uiSelect directive link function
     ctrl.refreshDelay = undefined; // Initialized inside uiSelectChoices directive link function
 
+    ctrl.isEmpty = function() {
+      return angular.isUndefined(ctrl.selected) || ctrl.selected === null;
+    };
+
     var _searchInput = $element.querySelectorAll('input.ui-select-search');
     if (_searchInput.length !== 1) {
       throw uiSelectMinErr('searchInput', "Expected 1 input.ui-select-search but got '{0}'.", _searchInput.length);

src/select2/match.tpl.html

@@ -4,9 +4,9 @@
   do not work: [class^="select2-choice"]
 -->
 <a class="select2-choice ui-select-match"
-   ng-class="{'select2-default': $select.selected === undefined}"
+   ng-class="{'select2-default': $select.isEmpty()}"
    ng-click="$select.activate()">
-  <span ng-hide="$select.selected !== undefined" class="select2-chosen">{{$select.placeholder}}</span>
-  <span ng-show="$select.selected !== undefined" class="select2-chosen" ng-transclude></span>
+  <span ng-show="$select.isEmpty()" class="select2-chosen">{{$select.placeholder}}</span>
+  <span ng-hide="$select.isEmpty()" class="select2-chosen" ng-transclude></span>
   <span class="select2-arrow"><b></b></span>
 </a>

src/selectize/match.tpl.html

@@ -1 +1 @@
-<div ng-hide="$select.open || $select.selected === undefined" class="ui-select-match" ng-transclude></div>
+<div ng-hide="$select.open || $select.isEmpty()" class="ui-select-match" ng-transclude></div>