javascript - angularjs - 选择的 ng-model 索引

标签 javascript angularjs angularjs-scope

我试图在选择控件中获取所有选定的项目,例如它的值或标题。基本上,在用户从选择控件中选择了他/她想要的项目后,我想获取所选项目的数量及其标题或值。

在我的 html 页面中,我有以下代码片段:

  <select ng-model="selectedValues" multiple>
            <option >All Booth</option>
            <option> Washroom</option>    
 </select>

 <button ng-click="apply()" type="button">Apply</button>

在我的 Controller 中,我有以下代码片段:

$scope.apply = function () {
// Get the number of selected items and its title or value


}

有谁知道我可以实现这个目标的方法吗?谢谢。

最佳答案

请查看演示:

angular.module('app', [])

.controller('appCtrl', function ($scope) {

    $scope.apply = function () {
        if ($scope.selectedValues != undefined && $scope.selectedValues.length > 0) {
            // Get the number of selected items and its title or value
            var selectedTitles = $scope.selectedValues;//Get title or value
            var noSelectedItems = $scope.selectedValues.length;//Get the number of selected items

            console.log("Total items selected :" + noSelectedItems + " titles '" + selectedTitles.toString() + "'");
        }
        else {
            console.log("No item selected");
        }
    }

});
<!DOCTYPE html>
<html>

  <head>
    
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.js"></script>
   
  </head>

  <body ng-app="app" ng-controller="appCtrl">
     <select ng-model="selectedValues" multiple>
            <option>All Booth</option>
            <option>Washroom</option>    
 </select>

 <button ng-click="apply()" type="button">Apply</button>
  </body>

</html>

关于javascript - angularjs - 选择的 ng-model 索引,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41438426/

相关文章:

javascript - jQuery Validate - 将错误类添加到父 Div

javascript - 如何从 Controller 返回 JavaScript?

javascript - 更改复选框列表项的颜色 onChange

在 apache 上使用 UI 路由器的 AngularJS HTML5 模式

javascript - 将 Angular 元素绑定(bind)到 Controller 外部的范围

angularjs - 如何将数据从父元素的指令传递到子元素?

unit-testing - 如何在AngularJS中测试$ scope。$ on

javascript - Apache PDF 数字签名

angularjs - 在 AngularJS 中转换 JSON 日期

javascript - 如何在 javascript 中添加 img-responsive 类