Question

我正在使用json从服务器收集属性类型列表，但似乎无法填充下拉列表。以下代码包含一些注释掉的硬编码，但也无法正常工作。在开发人员工具中，将创建正确数量的选项，但未设置文本和值。

淘汰赛代码：

var self;
var propertyTypes;
var NewBuildViewModel = function () {
    self = this;
    self.enteredBlockUprn = ko.observable("");
    self.showForm = ko.observable(false);
    self.PropertyTypes = ko.observableArray([]);
    //var temp = GetHiddenField("sir-property-types");
    var temp1 = ([
        {
            PropertyTypeId: 1,
            Type: "Maisonette"
        },

        {
            PropertyTypeId: 2,
            Type: "House"
        },
        {
            PropertyTypeId: 3,
            Type: "Flat"
        }
    ]);
    ko.mapping.fromJS(temp1, {}, self.PropertyTypes);
    self.selectedPropertyType = ko.observable("");
    self.getNewBuildDetails = function () {
        var enteredUprn = this.enteredBlockUprn();
        if (enteredUprn.length > 0) {
            getNewBuildFromBlockUPRN(enteredUprn);
        }
    };
};

var displayNewBuild = function (data) {
    var json = $.parseJSON(data);
    ko.mapping.fromJS(json, {}, self);
    self.showForm(true);
};

var getNewBuildFromBlockUPRN = function (blockUPRN) {
    var url = GetHiddenField("sir-get-new-build-url").replace("@", blockUPRN);
    var callback = displayNewBuild;
    var errorCallback = errorMessage;
    dataService.getItem1(url, callback, errorCallback);
};

@using Newtonsoft.Json
@model NewBuildBlockViewModel
@{
    ViewBag.Title = "Add/Edit New Build Properties";
    ViewBag.GetNewBuildUrl = "/api/newbuild/@/getnewbuildbyuprn".ToServer();
    var data = JsonConvert.SerializeObject(SessionObjectSir.PropertyTypes);
}
<div id="hiddenFields"
     data-sir-get-new-build-url="@ViewBag.GetNewBuildUrl"
     data-sir-property-types="@JsonConvert.SerializeObject(SessionObjectSir.PropertyTypes)"></div>
<fieldset>
    <legend>@ViewBag.Title</legend>
    <section id="sectionEnterBlockUPRN">
        <div id="divEnterBlockUPRN">
            <div class="container">
                <div class="row">
                    Add/Edit Property for Block UPRN:
                    <input type="text" data-bind="value: enteredBlockUprn" id="EnteredBlockUprn" />
                    <input type="button"
                           data-bind="click: getNewBuildDetails"
                           id="btnAddEdit"
                           class="btn btn-sm btn-primary"
                           value="Add/Edit" />
                </div>
            </div>
        </div>
    </section>
    <section id="sectionEnterNewBuildDetails" data-bind="if: showForm" style="background-color: whitesmoke;" class="container">
        <div id="divEnterNewBuildDetails">
            <h4>Enter New Build</h4>

            <div class="row" style="margin-bottom: 5px;">
                <div class="col-md-2" style="text-align: right"><label for="PropertyTypes">Property Type:</label></div>
                <div class="col-md-4" style="text-align: left">
                    <select data-bind="options: 'PropertyTypes', optionsText: 'Type', optionsValue: 'PropertyTypeId', value: selectedPropertyType, optionsCaption: '<-- Select Property Type -->'"></select>
                </div>
            </div>
            <p><button id="newBuildSave" class="btn btn-xs btn-primary">Save</button></p>
        </div>
    </section>
</fieldset>

@section scripts
{
    @Scripts.Render("~/bundles/sir/addeditnewbuildproperty")
    <script type="text/javascript">
        var newBuildViewModel = new NewBuildViewModel();
        ko.applyBindings(newBuildViewModel);
    </script>
}

那我该如何解决呢？

Answer 1

花了一段时间才能浏览所有这些代码，但是错误最终显示出来了。您的选择绑定绑定到字符串'PropertyTypes'而不是可观察数组import QtQuick 2.9 import QtQuick.Window 2.2 import QtQuick.Controls 1.4 import QtQml.Models 2.11 Window { visible: true width: 640 height: 480 TreeView { id: treeView anchors.fill: parent model: tree_model selectionMode: SelectionMode.MultiSelection selection: ItemSelectionModel { id: ism model: tree_model } TableViewColumn { title: "Name" role: "display" width: 300 } itemDelegate: Item { Text { anchors.verticalCenter: parent.verticalCenter color: styleData.textColor elide: styleData.elideMode text: styleData.value } MouseArea{ anchors.fill: parent onClicked: { var ix = tree_model.index(0, 0, styleData.index) ism.select(ix, ItemSelectionModel.Select) } } } } }。您只需要删除该绑定目标周围的引号即可。

PropertyTypes

repro：

<select data-bind="options: PropertyTypes, ...

var self;
var propertyTypes;
var NewBuildViewModel = function (data) {
    self = this;
    self.enteredBlockUprn = ko.observable("");
    self.showForm = ko.observable(false);
    self.PropertyTypes = ko.observableArray([]);

    var temp1 = ([ { PropertyTypeId: 1, Type: "Maisonette" },  { PropertyTypeId: 2, Type: "House" }, { PropertyTypeId: 3, Type: "Flat" } ]); 
    ko.mapping.fromJS(temp1, {}, self.PropertyTypes);
    self.selectedPropertyType = ko.observable("");
    self.getNewBuildDetails = function () {
        var enteredUprn = this.enteredBlockUprn();
        if (enteredUprn.length > 0) {
            //getNewBuildFromBlockUPRN(enteredUprn);
        }
    };
    
    self.showForm(true); //added for debugging
};

ko.applyBindings(new NewBuildViewModel());

淘汰赛：不从json填充dorp下拉列表

1 个答案: