2

私は別の問題に遭遇しましたが、それはマイナーかもしれません。

現在、次の構造があります。

【ViewModelのコード】

public class ResultModel
{
    public Dictionary<Person, List<Person>> dictPeople { get; set; }
    public string dictPeopleJson { get; set; }
    public ResultModel()
    {
        dictPeople = new Dictionary<Person, List<Person>>();
    }
}

public class Person
{
    public int ID { get; set; }
    public string Name { get; set; }
    public string Surname { get; set; }
}

【コントローラー用コード】

public ActionResult Index()
    {
        var p1 = new Person();
        p1.ID = 100;
        p1.Name = "John";
        p1.Surname = "Smith";

        var p2 = new Person();
        p2.ID = 104;
        p2.Name = "John";
        p2.Surname = "Harvard";

        var p3 = new Person();
        p3.ID = 109;
        p3.Name = "Kate";
        p3.Surname = "Robinson";

        var p4 = new Person();
        p4.ID = 116;
        p4.Name = "Kate";
        p4.Surname = "Smith";

        var p5 = new Person();
        p5.ID = 130;
        p5.Name = "Kate";
        p5.Surname = "Jane";

        List<Person> lstPerson1 = new List<Person>();
        lstPerson1.Add(p1);
        lstPerson1.Add(p2);


        List<Person> lstPerson2 = new List<Person>();
        lstPerson1.Add(p3);
        lstPerson2.Add(p4);
        lstPerson2.Add(p5);

        var vm = new ResultModel();
        vm.dictPeople.Add(new Person() {ID = 001, Name = "John", Surname = "Family"}, lstPerson1);
        vm.dictPeople.Add(new Person() {ID = 002, Name = "Kate", Surname = "Family"}, lstPerson2);
        vm.dictPeopleJson = JsonConvert.SerializeObject(vm.dictPeople, Formatting.Indented);
        vm.dictPeople = null;
        return View(vm);
}

【CSHTMLのコード】

<h2>Results</h2>
<table>
    <tbody data-bind="template: { name: 'tblResult', foreach: dictPeopleJson() }"></tbody>
</table>
<script id="tblResult" type="text/html">
    <tr>
        <td data-bind="foreach: key">
            <table>
                <td data-bind="text: ID"></td>
                <td data-bind="text: Name"></td>
                <td data-bind="text: Surname"></td>
            </table>
        </td>        
        <td>
            <table data-bind="foreach: value">
                <td data-bind="text: ID"></td>
                <td data-bind="text: Name"></td>
                <td data-bind="text: Surname"></td>
            </table>    
        </td>
    </tr>
</script>
<script type="text/javascript">
    var ResultModel = function(m) {
        var self = this;       
        self.dictPeopleJson = ko.observableArray(mapDictionaryToArray(m), function(person) {
            var per = new Person(person);
            return per;
        });
    };

    var Person = function(person) {
        var self = this;
        self.ID = ko.observable(person.Id);
        self.Name = ko.observable(person.Name);
        self.Surname = ko.observable(person.Surname);
    };

    function mapDictionaryToArray(dictionary) {
        var result = [];
        for (var key in dictionary) {
            if (dictionary.hasOwnProperty(key)) {
                result.push({ key: key, value: dictionary[key] }); 
            }  
        }

        return result;
    }

    var data = @(Html.Raw(Json.Encode(Model)));
    var dataFromServer = ko.utils.parseJson(data.dictPeopleJson);

    console.log(dataFromServer);  
    ko.applyBindings(new ResultModel(dataFromServer));

    console.log("apply binding");
</script>

次のような表示を取得しようとしています。

001 John Family     100 John Smith  104 John Harvard

002 Kate Family     109 Kate Robinson   116 Kate Smith ... etc

ただし、出力は最後の行バインディングのみで返されます (辞書のキー部分は表示されません)。

116 Kate    Smith

130 Kate    Jane

John ファミリーの値は失われ、配列には Kate のファミリーの値のみが含まれます

なぜこれが起こっているのですか?json 文字列への変換が完了すると、すべての値が文字列に表示されますが、コンソール ウィンドウには kate ファミリ (辞書の最後の項目) のみが表示されます。

ありがとう

4

1 に答える 1

0

この行でデバッグしてください

vm.dictPeople = null;

そこにはいないと思います

于 2012-12-11T05:49:37.130 に答える