首页 > 解决方案 > angular 使用 ng-options 将 whitepace 视为 null

问题描述

在控制器中,我有一个这样的数组

    'Pipe': '|',
    'Comma': ',',
    'Tab': '\t'
  };

在 ng-options 中,我像这样使用它

<select 
    ng-model="csv.delimiter"
    ng-options="value as key for (key, value) in delimiters">
</select>

当我打印值 csv.delimiter 时,它显示管道和逗号的正确值,但对于选项卡,它显示为空。它还为空格和其他转义字符显示 null。请帮忙

我希望制表符、空格或任何其他转义字符的非空值

标签: javascripthtmlangularjsng-options

解决方案


我没有看到你描述的行为。制表符是一个有效的选择,并且模型被适当地设置为制表符字符。请参阅下面的演示。

angular.module('myApp', [])
.controller('MainController', function ($scope) {
  $scope.delimiters = {
    Pipe: '|',
    Comma: ',',
    Tab: '\t'
  };
  
  var arr = ['foo', 'bar', 'baz'];
  
  $scope.setData = function (delimiter) {
    // For demo purposes. This is not spec to delimit
    // data by a character.
    $scope.data = arr.join(delimiter);
  };
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js"></script>
<div ng-app="myApp" ng-controller="MainController">
  <select 
      ng-model="csv.delimiter"
      ng-options="value as key for (key, value) in delimiters"
      ng-change="setData(csv.delimiter)">
  </select>
  <br />
  {{csv.delimiter}}
  <br />
  Is Pipe: {{csv.delimiter===delimiters.Pipe}}
  <br />
  Is Comma: {{csv.delimiter===delimiters.Comma}}
  <br />
  Is Tab: {{csv.delimiter===delimiters.Tab}}
  <br />
  <textarea ng-model="data">
  
  </textarea>
</div>


推荐阅读