Question

我在select中有一些动态生成的values：

<select ng-model="selectedValue" ng-options="o.id as o.name for o in values"></select>

我拥有保留所选值的selectedValue。我希望在null中undefined不再存在时，将其更新为selectedValue或values。

我可以清除selectedValue中的$scope.$watch(values)但是有更好的解决方案吗？

基本上this plunker中的这种情况是我想要避免的：

This is what I want to avoid

我希望它是“Selected value：null”或类似的东西。

Answer 1

您可以创建一个指令，使您的选择行为符合您的要求。然后HTML将更改为：

<select clearable ng-model="selectedValue" ng-options="o.id as o.name for o in values"></select>

该指令的JS将是：

app.directive('clearable', ['$parse',function($parse){
  return {
    restrict : 'A',
    scope : {
      'ngModel' : '=',
      'ngOptions' : '@'
    },
    require: ['select','?ngModel'],
    link : function(scope, elem, attr,ctrl){

      // Regex copied from the Angular Source
      var NG_OPTIONS_REGEXP = /^\s*([\s\S]+?)(?:\s+as\s+([\s\S]+?))?(?:\s+group\s+by\s+([\s\S]+?))?\s+for\s+(?:([\$\w][\$\w]*)|(?:\(\s*([\$\w][\$\w]*)\s*,\s*([\$\w][\$\w]*)\s*\)))\s+in\s+([\s\S]+?)(?:\s+track\s+by\s+([\s\S]+?))?$/;
      var match = scope.ngOptions.match(NG_OPTIONS_REGEXP);

      var valuesFn = $parse(match[7]),    //Options list
          key = match[1].split('.')[1];   //Property in options list

      scope.$watch(
        function(){
          // Watch for when the options list changes
          return valuesFn(scope.$parent);
        }, 
        function(newList){
          var isFound, i,
              currentModelVal = scope.ngModel;

          // Iterate through the new list to see if the current value is present
          for(i=0;i<newList.length;i++){
            if (newList[i][key] === currentModelVal){
              isFound = true;
              break;
            }
          }

          // If not found, reset the ng-model value to null
          if (!isFound){
            ctrl[1].$setViewValue(null);
          }
        }
      );

    }
  }  
}]);

请参阅http://plnkr.co/edit/yAk9YSoMf88rtTqLXTiI?p=preview

上的Plunker

Answer 2

您可以使用空值选项，并且在未选择任何项目时模型将设置为空

检查这个

<option value="">--select--</option>

http://plnkr.co/edit/66KN7ae0q2v3IUnw47lx?p=preview

角动态选择值

2 个答案: