如何知道哪些元素角度JS选择 [英] how to know which element is selected in angular js

问题描述

我做出选择的多酥料饼，其中用户可以选择多个值。我要打印屏幕上的所有选定的值或者得到一个对象，其中后者由用户选择的所有元素。我会。在我的演示换句话说，我必须在屏幕上。对键一键点击解释我打开弹出了这有多种选择的元素我想这是由用户选择在弹出请检查所有元素我的演示。这里是我的演示

的http：//$c$cpen.io/anon/pen/KpaejV

  angular.module（'ionicApp'，['离子']）
.controller（'myController的'，函数（$范围，$ ionicPopover）{
  $ scope.data = [
    {名：A}，
    {名：B}，
    {名：C}，
    {名：D}，
    {名：E}
  ]
  $ ionicPopover.fromTemplateUrl（我的-popover.html'，{
    适用范围：$范围
  }），然后（功能（酥料饼）{
    $ scope.popover =酥料饼;
  }）;
  $ scope.openPopover =功能（$事件）{
    $ scope.popover.show（$事件）;
  };   $ scope.closePopover =功能（）{
    $ scope.popover.hide（）;
  };
}
）
 

解决方案

您可以更改模型添加一个属性：

  $ scope.data = [
    {名：A，检查：假}，
    {名：B，检查：假}，
    {名：C，检查：假}，
    {名：D，检查：假}，
    {名：E，检查：假}
  ];
 

您名单将有属性附加到元素（ NG-模型）

 ＆LT;李班=项项，勾选＆GT;
     ＆LT;标签类=复选框＆GT;
       ＆LT;输入类型=复选框NG模型=item.checkedNG点击=itemChecked（项目）＆GT;
     ＆LT; /标签＆gt;
     {{项目名}}
  ＆LT; /李＆GT;
 

和你可以听的变化添加一个方法（ itemChecked ）通过你的项目：

  $ scope.itemChecked =功能（项目）
  {
    警报（item.name）;
  }
 

这是修改后的 plunker 。

如果你想限制检查：

  $ scope.itemChecked =功能（项目）
{
    变种数= 0;
    angular.forEach（$ scope.data，功能（值，键）{
      数+ = value.checked？ 1：0;
    }）;
    如果（计数→3）
    {
        item.checked = FALSE;
    }
  }
 

I make multiple selected popover , in which user can select multiple values . I want to print the all selected value on screen or get a object in which all element which is selected by user .I will explain in other words .In my demo I have one button on screen .On button click I open a pop over which have multiple selected element I want to get all element which is selected by user in pop up please check my demo .here is my demo

http://codepen.io/anon/pen/KpaejV

angular.module('ionicApp', ['ionic'])
.controller('MyController', function($scope, $ionicPopover) {
  $scope.data =[
    {"name":"A"},
    {"name":"B"},
    {"name":"C"},
    {"name":"D"},
    {"name":"E"}
  ]
  $ionicPopover.fromTemplateUrl('my-popover.html', {
    scope: $scope
  }).then(function(popover) {
    $scope.popover = popover;
  });


  $scope.openPopover = function($event) {
    $scope.popover.show($event);
  };

   $scope.closePopover = function() {
    $scope.popover.hide();
  };
}
)

解决方案

You can change your model adding a property:

$scope.data =[
    {"name":"A", checked: false},
    {"name":"B", checked: false},
    {"name":"C", checked: false},
    {"name":"D", checked: false},
    {"name":"E", checked: false}
  ];

Your list will have the property attached to the element (ng-model):

<li class="item item-checkbox">
     <label class="checkbox">
       <input type="checkbox" ng-model="item.checked" ng-click="itemChecked(item)">
     </label>
     {{item.name}}
  </li>

and you can listen to the changes adding a method (itemChecked) passing your item:

$scope.itemChecked = function(item)
  {
    alert(item.name);  
  }

and this is your modified plunker.

if you want to limit the checks:

$scope.itemChecked = function(item)
{
    var count = 0;
    angular.forEach($scope.data, function(value, key) {
      count += value.checked ? 1 : 0; 
    });
    if (count > 3)
    {
        item.checked = false;
    }
  }

这篇关于如何知道哪些元素角度JS选择的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！