Question

我使用angularJS和jQuery的组合使用工具提示小部件和下拉菜单。

我们正在抓取一堆多选的名字，当我从下拉菜单中选择几个项目时，我拉着文字来获取标签（因为这些项目来自一个数据库，值不起作用，它只显示数字）

现在我正在与

合作

$scope.selected = $('#filter option:selected').text();

如果我选择：＆＃39;红色，蓝色，绿色＆＃39;它被替换为redbluegreen。

无论如何我可以使用.text（）保留空格吗？我在网站上搜索过，无法找到相关内容。

Answer 1

$scope.selected = $('#filter option:selected').map(function() {
    return $(this).text();
}).get().join(' ');

http://api.jquery.com/jquery.map/

Answer 2

尝试类似：

div

Answer 3

由于jQuery确实没有在控制器中使用任何业务，这里有一个更合适的角度解决方案，它将使用ng-change实时更新

HTML

<select multiple 
        ng-model="mySelect" 
        ng-options="opt.id as opt.val for opt in options" 
        ng-change="updateSelected()">
</select>

控制器

  var options = [
    {id: 1,val: 'item 1'}, 
    ..........
    {id: 6,val: 'item 6'}
  ];

  /* used in "ng-change" on select*/
  function updateSelected() {
    // map text from options
    $scope.selected = $scope.options.map(function(option) {
      return $scope.mySelect.indexOf(option.id) > -1 ? option.val : null
    }).join(' ');
  }

  // scope object
  var scope = {
    mySelect: [1, 3, 4], // ng-model for select
    selected : null,// space separated text variable
    updateSelected: updateSelected,
    options: options // options for select
  }
  // extend $scope with scope object
  angular.extend($scope, scope);
  // create initial options text
  $scope.updateSelected();

的 DEMO

使用.text（）时如何向文本添加空格

3 个答案: