6

私は次のコードを持っていますが、クライアントを呼び出しておらず、情報で KnockOutJS ビューモデルを更新していないようです。ページの読み込み時に GetOuting() が呼び出され、正しい情報がビューモデルに入力されます。Chrome は、開発者ツールに JS エラーを表示しません。その時点から、トラブルシューティングの方法を理解するのに苦労しています。どんな助けでも大歓迎です。SignalR ハブ

public class Outings : Hub
{
    private static Dictionary<Guid, OutingViewModel> outings = new Dictionary<Guid, OutingViewModel>();

    public void GetOuting(string id)
    {
        var guidID = new Guid(id);
        bool containsOuting = outings.ContainsKey(guidID);
        if (!containsOuting)
        {
            var outingAccessor = new OutingAccessor();
            outingAccessor.ID = guidID;
            outingAccessor.Load();
            var outingVM = new OutingViewModel(outingAccessor);
            outings.Add(guidID, outingVM);
        }
        var outing = outings[guidID];
        this.Clients.updateOuting(outing);
    }

    public void SaveOuting(string outingNumber, OutingViewModel outing)
    {
        var guidID = new Guid(outingNumber);
        outings[guidID] = outing;
        this.Clients.updateOuting(outing);
    }
}

ビューモデル

public class OutingViewModel
{
    public OutingViewModel(OutingAccessor outingAccessor)
    {
        ID = outingAccessor.ID;
        OutingNumber = outingAccessor.OutingNumber;
        var outingGeneralAccessor = new OutingGeneralAccessor();
        var outingGeneral = outingGeneralAccessor.GetOutingGeneralByOutingID(outingAccessor.ID);
        this.OutingName = outingGeneral.Name;
    }
    public Guid ID { get; set; }
    public int OutingNumber { get; set; }
    public string OutingName { get; set; }
}

HTML + JavaScript

@model string
<script src="@Url.Content("~/Scripts/jquery-1.7.1.min.js")" type="text/javascript"> </script>
<script src="@this.Url.Content("~/Scripts/jquery.signalR.js")" type="text/javascript">     </script>
<script src="@this.Url.Content("~/Scripts/knockout.js")" type="text/javascript"> </script>
<script type="text/javascript" src="/signalr/hubs"> </script>
<script type="text/javascript">
    $(function() {
        function outingDataViewModel() {
            this.hub = $.connection.outings;
            this.ID = ko.observable();
            this.OutingNumber = ko.observable();
            this.OutingName = ko.observable();
            //Initializes the view model
            this.init = function() {
                this.hub.getOuting('@this.Model');
            };
            this.hub.updateOuting = function(data) {
                ID(data.ID);
                OutingName(data.OutingName);
                OutingNumber(data.OutingNumber);
            };
        }
        var vm = new outingDataViewModel();
        ko.applyBindings(vm);
        // Start the connection
        $.connection.hub.start(function() { vm.init(); });
    });
</script>
<h1>Outing Number</h1>
<div id="OutingSummary">
    <div data-bind="text:OutingNumber"></div>
    <div data-bind="text:OutingName"></div>
</div>

さらにデバッグすると、行にあるように見えます

ID(data.ID);
OutingName(data.OutingName);
OutingNumber(data.OutingNumber);

ID を設定しようとすると、「undefined_method」の例外が発生しているようです。それは他の誰かにとって意味がありますか？

4

1 に答える 1

8

問題がどこにあるかは正しいです。サーバーが updateOuting メソッドを呼び出し、コードを実行すると、次のようになります。

ID(data.ID);
OutingName(data.OutingName);
OutingNumber(data.OutingNumber);

ID、OutingName、および OutingNumber を探す場所がわかりません。これらがビュー モデル オブジェクトに存在することを指定する必要があります。問題を解決する 1 つの解決策は、JavaScript コードを次のように変更することです。

<script type="text/javascript">
    $(function () {
        function outingDataViewModel() {
            var self = this;
            self.hub = $.connection.outings;
            self.ID = ko.observable();
            self.OutingNumber = ko.observable();
            self.OutingName = ko.observable();
            //Initializes the view model
            self.init = function () {
                self.hub.getOuting('@Guid.NewGuid().ToString()');
            };
            self.hub.updateOuting = function (data) {
                self.ID(data.ID);
                self.OutingName(data.OutingName);
                self.OutingNumber(data.OutingNumber);
            };
        }
        var vm = new outingDataViewModel();
        ko.applyBindings(vm);
        // Start the connection
        $.connection.hub.start(function () { vm.init(); });
    });
</script>

それが役に立てば幸い！

于 2012-02-29T01:43:27.220 に答える