当前位置: 首页 > 知识库问答 >
问题:

将角度材质设计复选框绑定到控制器中的数组

白智
2023-03-14

我有一组材质设计复选框,我想将它们的值绑定到控制器中的数组。

为了实现这一点,我使用了SO答案中描述的第一种方法。当这些值被正确地添加和从列表中删除时,当我单击它们时,这些框不再显示为“选中”。我的代码在下面,我也在这个代码页中重新创建了这个问题。

我的复选框的HTML

<md-checkbox 
    ng-repeat="site in websites" 
    value="{{site}}" 
    ng-checked="selection.indexOf(site) > -1" 
    ng-click="toggleSelection(site)"> 
    {{site}}
</md-checkbox>

来自控制器的JavaScript

  $scope.websites = ['Facebook', 'Twitter', 'Amazon'];
  $scope.selection = ['Facebook'];
  $scope.toggleSelection = function toggleSelection(site) {
    var idx = $scope.selection.indexOf(site);

    // is currently selected
    if (idx > -1) {
      $scope.selection.splice(idx, 1);
    }

    // is newly selected
    else {
      $scope.selection.push(site);
    }
  };
});

共有1个答案

葛威
2023-03-14

尝试更改此设置:

ng-checked="selection.indexOf(site) > -1" 

对此:

ng-checked="{{selection.indexOf(site) > -1}}" 

为我工作:http://codepen.io/anon/pen/xbNOmE

 类似资料:
  • 我有一个mat select,其中的选项是数组中定义的所有对象。我试图将该值设置为其中一个选项的默认值,但是当页面呈现时,该值处于选中状态。 我的typescript文件包含: 我的HTML文件包含: 我已尝试将和

  • 我对Angular2还很陌生,我有一个小问题: 在我的Login-Component-HTML中,我有两个复选框,我希望以两种方式将它们绑定到login-component-typescript数据绑定。 这是HTML: 这是组件.ts: 如果我单击一个复选框,我会在控制器(组件)中获得正确的值。 但是如果更改组件中例如的值,则复选框不会“获取”新值。 因此我无法操作组件中的复选框(就像我想在组件

  • 我正在使用AngularMaterial2的对话框。 我想将数据传递给打开的组件。以下是单击按钮打开对话框的方式 在文档页面上有数据属性,但我在已安装的软件包中检查了MdDialogConfig。 配置类中没有数据属性。 现在我如何通过数据的访问?

  • 我有一个非常简单的角度材料选择组件,从一个对象数组填充。我尝试了ngModel和component select属性的双向绑定,但两者都不能像预期的那样工作。 我所期望的:更改选择的选项将相应地更新ngModel值。 实际发生的情况:更改selected选项会触发select change方法,但不更新binded属性。 如何再现:选择选项2,然后回到选项1,只播放2个选项。 转载位置:https

  • > 到目前为止,我使用角2快速入门创建了一个新项目。 我决定开始使用angular 2 cli,并创建了一个新的angular 2 cli项目。 移动了我的所有文件并重新安装了所有软件包。 现在,当我试图在CLI项目中使用角2材料时,我遵循了这里的指南,但这是我得到的: 会出什么问题?

  • 问题内容: 我想将一些数据传递给$ mdDialog。实际上,我在一个单独的文件中有两个控制器。这是我的控制器代码 我想tp将profileId传递给profileController并显示配置文件数据。在配置文件控制器中,我以此获取数据 但是这个错误出现在控制台中 这是什么错误以及如何解决? 问题答案: 我添加了配置文件模板,这是由于错误。通过删除它,我的问题解决了。