Angular Select 选项值为 space

Question

我有一个 <select> 和一个 ng-model，其中一个选项是 space。当初始值为其他值时，angular select 是正确的选项，但当初始值为 space 时，angular 添加空选项。

我可以用 html 复制它，例如：

<select ng-model="a" ng-trim="false">
  <option value=" ">Default</option>
</select>

<select ng-model="b">
  <option value="x">Default</option>
</select>

和控制器，例如：

$scope.a = " ";
$scope.b = "x";

第一个 select 将有一个空白选项，第二个将显示 "Default"。添加 ng-trim 似乎没有帮助，而且我从数据库中获取值，因此无法轻易更改它们。

我可以使用 Angular 1.4.8、1.4.9（我正在使用）和 1.5.8 重现该问题，全部来自 https://code.angularjs.org/。

我这里有一个fiddle：https://jsfiddle.net/d1cj3kzb/4/。

当 ng-model 初始化为 space 时，如何让 <select> 显示正确的选项？

Answer 1

尝试在您的代码中声明一个具有默认值的变量，在本例中为 space，例如：

$scope.spaceChar = " ";

然后在你的 select:

<select ng-model="a" ng-trim="false">
    <option value="{{spaceChar}}">Default</option>
</select>

Answer 2

你能试试这个吗？

将 ng-trim 应用于您的选项：

<div ng-app="app" ng-controller="MyCtrl">
    <select ng-model="a" >
      <option value=" " ng-trim="true">Default</option>
    </select>

    <select ng-model="b">
      <option value="x">Default</option>
    </select>

trim 绑定前的变量。

angular.module("app", [])
  .controller("MyCtrl",
    function ($scope) {
        $scope.a = (" ").trim();
        $scope.b = "x";
    }
);

Angular Select 选项值为 space

Angular Select with an option value of space

javascript

angularjs

angular-ngmodel