javascript - 如何使用 asp.net mvc 和 knockoutjs 构建对 javascript 函数的动态调用

Question

我正在构建一个使用 HotTowel 模板的 mvc 应用程序(您知道，durandal、knockout、breeze 等)。该应用程序尚未准备好，但我们正在取得良好进展:)。在一个功能的中间，我需要构建一个对 javascript 函数的动态调用。使用硬代码值的调用类似于:

<a href="#" id="openreport"                                                 
onclick="showReport('@Url.Action("Index","Report", new { Id= 9, languageId = 2})');">Show  
report</a>

上面的调用工作正常。当我尝试使用 knockoutjs 将 onclick 事件绑定(bind)到字符串属性时，我的麻烦就开始了。像这样:

<a href="#" id="openReport" data-bind="onclick: $root.reportUrl()"  > 
 Show report                                                

其中报告 url 是一个可观察的变量。这里是 typescript 代码:

export var reportUrl =<any> ko.observable();

export var expandRow = function (myObjectComeFromATable) {

    var urlAction = '@Url.Action("Index", "Report", new { Id= ID_TO_REPLACE, languageId = LANG_TO_REPLACE }) ';
    var url = "showReport('"+urlAction+"');";
    reportUrl(url);   
};

更新使用引号很好。 knockout 变量的值与之前显示的硬代码值相同。可能是布局中的 sintaxis 有问题？

Answer 1

您正在尝试评估可观察对象中的代码？我不认为它会工作。您可以在函数中手动执行 eval。但我认为这不是一个好的解决方案。

如果您总是在点击时调用“showReport”，则不需要评估:只需在您的模型中有一个包含要调用的 url 的属性，然后在回调函数中运行 showReport(yourUrl)。

如果您在单击时调用的函数发生变化，您可以保留对该函数的引用以在您的模型中调用。类似的东西(但更干净):

var model = function() {
    var _this = this;
    this.function1 = function() {
         alert('hello');   
    }
    this.function2 = function() {
         alert('world');   
    }
    this.run = function() {
         _this.current(); 
    }
    this.change = function() {
         _this.current = _this.function2;   
    }

    this.current = this.function1;
}
ko.applyBindings(new model());


<a href="#" data-bind="click: run">Click</a>
<a href="#" data-bind="click: change">Switch</a>

参见此处:http://jsfiddle.net/pp2QA/2/