时间戳

首页 > 解决方案 > _.findwhere 在选择选项上不适用于 ng-repeat

javascript - _.findwhere 在选择选项上不适用于 ng-repeat

问题描述

我有以下下拉代码

<select data-role="listview" class="form-control" id="txtUserRole" name="Role" data-ng-model="AddEditUserCtrl.SelectedRoleId" required="required"
        data-ng-disabled="!($root.UserSchoolPermissions.indexOf('User.ChangeRole') > -1) && AddEditUserCtrl.isInEditMode" 
        data-ng-change="AddEditUserCtrl.roleChanged(AddEditUserCtrl.SelectedRoleId)"  
        data-ng-class="{'border-error': AddEditUserCtrl.userForm.Role.$invalid && AddEditUserCtrl.userForm.Role.$error.required  && (!AddEditUserCtrl.userForm.Role.$pristine || submitted)}">
            <option value="" selected class="text-muted">{{'Role' | translate}}</option>
            <option data-ng-repeat="option in AddEditUserCtrl.roles" value="{{option.RoleId}}" title="{{option.RoleName}}" data-ng-selected="{{AddEditUserCtrl.SelectedRoleId == option.RoleId}}">{{option.RoleName | translate}}</option>
</select>

我想要做的是AddEditUserCtrl.SelectedRoleId从 ng-model 获取并将其传递给 ng-change 函数以使用 _.findwhere 使用下面的 JS 代码获取角色对象 

 AddEditUserCtrl.roleChanged = function (roleId) {
            
            var selectedrole = _.findWhere(AddEditUserCtrl.roles, {
                RoleId: roleId
            });
            AddEditUserCtrl.user.Role = selectedrole
            }

调试后我发现它roleId是从 html 传递的，并且AddEditUserCtrl.roles数组包含匹配的对象，roleId但它不起作用。

检查以下屏幕截图以了解我的调试 在此处输入图像描述 PS：我尝试使用 data-ng-options 制作选择标签并且它有效，但我需要在选项标签上使用 data-neg-repeat

标签： javascriptangularjs

解决方案

根据您的屏幕截图，您似乎正在尝试比较字符串和数字。roleId被传递给findWhere()看起来是一个字符串，但RoleId您尝试匹配的属性是一个数字，这就是为什么没有匹配的原因。尝试以下操作，将一元加运算符roleId添加到来自 HTML 的字符串以转换为数字：

var selectedrole = _.findWhere(AddEditUserCtrl.roles, {
  RoleId: +roleId
});

您还可以使用Number(roleId)orparseInt(roleId, 10)将字符串转换为数字。

var roles = [
  { RoleId: 1, RoleName: "Teacher" },
  { RoleId: 2, RoleName: "Student" },
  { RoleId: 9, RoleName: "Foo" }
];

function roleChanged(roleId) {
  var selectedRole = _.findWhere(roles, {
    RoleId: +roleId
  });
  
  console.log(selectedRole);
}

roleChanged("9");
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore.js"></script>

希望这会有所帮助！

推荐阅读