Question

我有一个使用Knockout JS的MVC网站。基本上，MVC处理路由到几个不同的页面，每个页面都有一个viewmodel。

其中一个页面需要一个参数来过滤数据。该页面的MVC控制器代码如下：

public ActionResult Transactions(int policyId)
{
    ViewData["policyId"] = policyId;
    return View();
}

该页面的视图包含隐藏字段。

<input type="hidden" name="hldPolicy" value="@ViewData["policyId"]">

然后在页面的html之后，

@section scripts
{
    @Scripts.Render("~/bundles/myBundle")
    <script>

        $(document).ready(function () {
            var policyId = $('#hldPolicy').val();
            var transactionViewModel = new TransactionViewModel(policyId);
            ko.applyBindings(transactionViewModel);
        });

    </script>
}

问题是这不起作用，因为脚本运行时隐藏字段未定义。这对我来说没有意义，因为我认为这就是$（文件）.ready正在防范的。我在这做错了什么？是否有更好的方法将参数从URL参数传递到viewmodel？

Answer 1

你可以像这样使用它。在这里，您实际上不必传递参数，而是定义一个将在viewmodel初始化时调用的函数，并根据您的要求获取数据。

@section scripts
{
    @Scripts.Render("~/bundles/myBundle")
    <script type="text/javascript">
        function TransactionViewModel(){
            var self = this
            self.SomeProperty = ko.observable()

            self.LoadData = function(){
                var policyId = $('#hldPolicy').val();
                self.SomeProperty(policyId)
            }
            self.LoadData()
        }

        $(document).ready(function () {
            ko.applyBindings(new TransactionViewModel());
        });
    </script>
}

当初始化淘汰模型时，它会自动调用self.LoadData()。

修改

我发现您在输入中缺少id属性

<input type="hidden" id="hldPolicy" name="hldPolicy" value="@ViewData["policyId"]">

现在它应该正常工作。

编辑：

您也可以这样做

@section scripts
{
    @Scripts.Render("~/bundles/myBundle")
    <script type="text/javascript">
        function TransactionViewModel(policyId){
            var self = this
            self.SomeProperty = ko.observable()

            self.LoadData = function(policyId){
                self.SomeProperty(policyId)
            }
            self.LoadData(policyId);
        }

        $(document).ready(function () {
            var policyId = $('#hldPolicy').val();
            ko.applyBindings(new TransactionViewModel(policyId));
        });
    </script>
}

将参数传递给我的Knockout ViewModel

1 个答案: