以 angularJS 形式更新具有整数值的属性的最佳方法是什么？答案

【问题标题】：What is the best way to update an attribute with integer values in a angularJS form?以 angularJS 形式更新具有整数值的属性的最佳方法是什么？
【发布时间】：2016-05-23 10:25:38
【问题描述】：

我正在尝试使用 angularJs 创建一个表单，我有一些整数类型的属性。

例如，我有一个名为 admin_events 的变量，它有 3 个值，0、1、2 表示用户访问不同文件的权限/权限。数字 0 表示无权限，1 表示仅查看，2 表示完全权限。现在我想为管理员创建一个用于编辑此属性的表单。我该怎么做呢？我正在考虑使用 angularJs 制作 1、2 和 3 的 3 个单选按钮/复选框，以便管理员只需单击该选项即可更新属性。

任何人对什么是最好的方法有什么建议吗？

【问题讨论】：

我个人会用 ng-options 做一个下拉菜单，你可以根据值显示文本
但我对 ng-options 有疑问，我不能使用它，因为我的 admin_event 只是一个包含整数值的变量，它不是 3 个整数的数组。所以我不能重复 admin_event 中的选项。

标签： angularjs checkbox radio-button

【解决方案1】：

最后，我决定使用范围类型的输入来实现选择。它更容易实现。

  <input ng-model= "user.activities.events" name="activities.events" type="range" max="2" min="0" class="form-control">

但我认为@sjokkogutten 的回答也不错。但复选框并不相互排斥。无论如何感谢@sjokkogutten。

【讨论】：

【解决方案2】：

这是一种可能的方法。有关说明，请参见内联 cmets。

app.controller('MainCtrl', function($scope, $filter) {

    // set up your model
    $scope.allPermissions = [
    { "id" : 3, "name" : "ADMIN", selected: false },
    { "id" : 2, "name" : "READ", selected: false },
    { "id" : 1, "name" : "WRITE", selected: false } ];

    // Use $watch to detect changes in the model. 
    // But you might as well want to call this from an event or whatever...
    $scope.$watch('allPermissions', function(newval, oldval){
      if (oldval != newval)
        {   
          // only return the checked values using $filter
          var selectedPermission = $filter('filter')($scope.allPermissions, {selected: true});

          // 'selectedPermission' will return a list of all selected permissions. 
          //  Use 'selectedPermission[0].id' to return the first value.
          $scope.admin_events = selectedPermission[0].id;

        }
    },true);

});

在你的 HTML 中

<body ng-controller="MainCtrl">
 <p ng-repeat="permission in allPermissions">
        <input type="checkbox" ng-model="permission.selected"/>
        {{permission.name}}
    </p>
    admin_events: {{admin_events}}

</body>

【讨论】：

好的，我试过了。看起来还不错，但是有没有可能每次只限制1个复选框被选中。