0

我完全被困住了。

给定一个静态可观察数组：

obj.allRoles = ko.observableArray([
    new Role(1, "Adminx"),
    new Role(2, "Temp2x"),
    new Role(3, "Temp3x")
    ]);

绑定到一个选择

<select data-bind="options: allRoles, 
                optionsText: 'RoleName',
                optionsValue: 'RoleId',                    
                optionsCaption: 'Add a new role...', 
                value: selectedRole">
</select>

以及通过点击绑定运行的函数：

function addRole() {

        alert('got id:' + obj.selectedRole());

        var selectedId = obj.selectedRole();
        var match = ko.utils.arrayFirst(obj.allRoles(), function (item) {
            return item.RoleId == selectedId;
        });

        alert('got :' + match.RoleName);
        return;
}

一切都很好。第一个警报显示 obj.SelectedRole() 返回选择选项的值，第二个警报显示找到匹配项并显示 RoleName。到目前为止还可以。

如果我将静态可观察数组替换为从服务填充的数组，例如：

obj.allRoles = ko.observableArray([]);

和

//data
    function loadAllRolesFromSvc() {
        var url = '/api/UserSvc/GetAllRoles';
        $.getJSON(url,
            function (data) {
                obj.allRoles.removeAll();

                var results = ko.observableArray();
                ko.mapping.fromJS(data, {}, results);

                for (var i = 0; i < results().length; i++) {                        
                    var role = new Role();
                    role.RoleId = results()[i].RoleId;
                    role.RoleName = results()[i].RoleName;
                    obj.allRoles.push(role);                        
                };
            }
        );
    };

然后我看到 select 填充 OK，但是当 addRole() 函数运行时，第一个警报显示 selectedRole 提供了一个值，但是通过 RoleId（在 addRole() 中）定位匹配 Role 对象的代码失败 - 匹配始终为空。

我怎样才能解决这个问题？欢迎大家指点。

非常感谢。

4

1 回答 1

0

我猜想RoleId和类中的RoleName属性Role是不可观察的，但在loadAllRolesFromSvc函数中你将它们设置为可观察的。

该代码ko.mapping.fromJS(data, {}, results);将结果中的所有属性转换为 observableArrays 和 observables。真的，我不明白你为什么要将结果转换为可观察的。因此，要解决问题，您可以删除映射：

   function loadAllRolesFromSvc() {
        var url = '/api/UserSvc/GetAllRoles';
        $.getJSON(url,
            function (data) {
                obj.allRoles.removeAll();

                for (var i = 0; i < data.length; i++) {                        
                    var role = new Role();
                    role.RoleId = data[i].RoleId;
                    role.RoleName = data[i].RoleName;
                    obj.allRoles.push(role);                        
                };
            }
        );
    };

或者您可以打开包装RoleId并设置RoleName值：

function loadAllRolesFromSvc() {
    var url = '/api/UserSvc/GetAllRoles';
    $.getJSON(url,
        function (data) {
            obj.allRoles.removeAll();

            var results = ko.observableArray();
            ko.mapping.fromJS(data, {}, results);

            for (var i = 0; i < results().length; i++) {                        
                var role = new Role();
                role.RoleId = results()[i].RoleId();
                role.RoleName = results()[i].RoleName();
                obj.allRoles.push(role);                        
            };
        }
    );
};
于 2012-12-21T12:39:52.737 回答