Questions tagged «knockout.js»

Knockout.js是使用模型-视图-视图模型(MVVM)模式的动态HTML UI的开源JavaScript库。

5
强制运行计算属性函数
给定计算属性 vm.checkedValueCount = ko.computed(function(){ var observables = getCurrentValues(); //an array of ko.observable[] return _.filter(observables, function(v) { return v() }).length; }); 假设getCurrentValues()可以返回不同的可观察对象集,这些可观察对象集在代码的其他位置进行了修改(并且来自比observableArray更复杂的结构)。 我需要checkedValueCount随时更新 其依赖项之一更改 getCurrentValues()返回一组不同的可观察值。 问题在于,它ko.computed似乎记住了最后返回的值,并且仅在依赖项更新时才更新。这处理第一种情况,但不适用于后者。 我正在寻找的是一种强制重新运行checkedValueCount的方法。我可以使用的东西: changeCurrentValues(); vm.checkeValueCount.recalculate(); 简而言之,鉴于我有 a = ko.computed(function() { return Math.random() }) 如何强制a()两次调用才能返回不同的值。

3
在剔除视图中访问$ parent的$ parent-嵌套上下文
为简洁起见更新 如何在嵌套的Knockout foreach中/使用绑定引用$ parents的$ parent? 范例- <!-- ko foreach: grandParent --> <tr> <!-- ko foreach: $parent.parents --> // <-- Doesn't work <!-- ko foreach: children --> <td data-bind="if: favToy().name == $parent.$parent.favToy().name"> <span data-bind="text: favToy().name"></span> </td> <!-- /ko --> <!-- /ko --> </tr> <!-- /ko --> 原版的 抱歉,这个令人困惑的问题,但是我正在尝试达到第二级父级的值,以检查当前上下文中的值(如下所示),仅在它与$ parent的$ parent的值匹配时才显示跨度(ugh!)。 <!-- …

8
如果iframe src无法加载,则捕获错误。错误:-“拒绝在框架中显示“ http://www.google.co.in/”。”
我Knockout.js用来绑定iframe广告src代码(这对于用户而言是可配置的)。 现在,如果用户配置了http://www.google.com(我知道它不会在iframe中加载,这就是为什么我将它用于-ve场景),并且必须在IFrame中显示它。但是会引发错误: 拒绝在框架中显示“ http://www.google.co.in/ ”,因为它将“ X-Frame-Options”设置为“ SAMEORIGIN”。 我为iframe使用以下代码:- <iframe class="iframe" id="iframe" data-bind="attr: {src: externalAppUrl, height: iframeheight}"> <p>Hi, This website does not supports IFrame</p> </iframe> 我想要的是,如果URL无法加载。我想显示自定义消息。 在这里 现在,如果我将onload和onerror用作:- <iframe id="browse" style="width:100%;height:100%" onload="alert('Done')" onerror="alert('Failed')"></iframe> 它可以很好地加载w3schools.com,但不能与google.com一起加载。 其次:-如果我将其作为一个函数并像我在小提琴中所做的那样尝试,则它不起作用。 <iframe id="browse" style="width:100%;height:100%" onload="load" onerror="error"></iframe> 我不知道该如何运行它并捕获错误。 编辑:-如果iframe未加载或在stackoverflow中加载问题,我曾想过要调用一个函数,但是它显示了可在iframe中加载的网站的错误。 另外,我已经研究了加载事件上的Stackoverflow iframe, 谢谢!

4
构建敲除js绑定时隐藏屏幕的最佳方法是什么?
我是淘汰赛的忠实粉丝。我现在将其用于我的所有Web开发,并且很喜欢它。我无法弄清的一件事是如何在构建基因敲除js绑定时隐藏UI。 例如,我有一个非常健壮的用户界面,页面上使用了许多模板。我注意到的问题是,当用户首次访问该页面时,他们会在一秒钟内看到我的所有模板,然后才开始绑定并隐藏它们。 解决此问题的最佳方法是什么?我曾尝试使用帮助器类来隐藏它们,但是除非我删除了帮助器类引用(即ui-helper-hidden),否则无法使用“可见”和“ if”绑定显示模板。

4
使用带有前缀的基因敲除js设置id属性
我正在使用KnockoutJS遍历一个对象,如下所示: 现在,这一切正常。但我的问题是,它设置id的button只是一个数字。所以看起来像这样: <button id="1">Button 1</button> <button id="3">Button 2</button> <button id="8">Button 3</button> 因此,我尝试在“ Id”属性前放置一个前缀,如下所示: <div data-bind="foreach:Items"> <button data-bind="text: Name, attr: {'id': 'myprefix_' + Id}"></button> </div> 但这似乎不起作用。id当我这样做时,我就充满了一些淘汰赛可观察的功能... 所以我的问题是,当我指定id字段的属性时如何添加前缀?

13
KnockoutJs v2.3.0:错误您不能多次将绑定应用于同一元素
我刚刚升级到2.3.0,现在出现错误 您不能多次将绑定应用于同一元素。 我没有进入2.2.1。 我从MVC控制器中获取了部分视图,并在单击href后将其添加到页面中。该错误发生在我第二次单击链接以获取部分视图时。我多次这样做。 有没有一种方法可以解决此问题并避免引发新的错误? 这是我的代码: $.get(url + "GetAssignedCompaniesView?layoutId=" + layoutId + "&noCache=" + new Date().getMilliseconds(), function (result) { $("#editAssignedPartial").html($(result)); showEditAssignedArea(true); $(window.document).ready(function () { // error is thrown here ko.applyBindings(self, window.document.getElementById("editAssigned")); $("#layoutId").attr("value", layoutId); updateTypeHiddenElement.attr("value", "companies"); }); }); <div id="editAssignedPartial"> </div> $(document).ready(function () { 'use strict'; var vm = new Vm(); …



3
Angular.js和ASP.NET MVC 4
关闭。此问题不符合堆栈溢出准则。它当前不接受答案。 想改善这个问题吗?更新问题,使其成为Stack Overflow的主题。 5年前关闭。 改善这个问题 我有一个ASP.NET MVC 4项目,但我在架构上决定要使用Angular.js或Knock.js的JavaScript框架或库。我目前倾向于在Knockout.js上使用Angular.js,但是我不想在项目开发的过程中发现错误。 这里是一些背景: 我们需要双向模型数据绑定 我们需要测试视图的能力。我希望能够进行端到端的单元测试。另外,我们正在使用持续集成。 “保存更改”功能。即,如果用户在页面上进行更改,我们需要能够检测到任何更改并提示用户保存其更改,然后再离开页面 “通知”功能。也就是说,用户将登录大约8个小时,并且需要通知和更新其他用户所做的更改(错误,数据状态更改等) 我们需要“面向未来”的应用程序。当前,该业务部门尚未决定是否需要支持移动设备,但我知道这只是时间问题。 我们的团队由经验丰富的开发人员组成,从初级到高级都有不同的经验水平。 目前,我们的模型很复杂,甚至可能变得更加复杂 我们还需要考虑RAD,代码重用和可维护性 我已阅读优秀的答案在这里,看着斯科特·艾伦的采访时谈到角在这里 由于我们无法从当前的ASP.NET MVC 4体系结构更改为在服务器端使用Web API之类的功能,因此我在尝试使用MVC 4实现Angular.js时会有些顾虑。这是否会导致我们拥有两个模型服务器和客户端上的一个? 我并不是想对Angular和Knockout进行“更好的讨论”,因为我认为它们都有优点和缺点。我正在寻找有关在ASP.NET MVC 4应用程序中实现JavaScript框架或库的实际代码。我需要一个可以从现在开始2年以上才能使用的解决方案:) 有什么想法或建议吗?也许答案不是Knock或Angular,而是其他JavaScript框架?

2
如何使用jsFiddle选择多个框架?
我实际上如何让jsfiddle使用多个库?我似乎只能使用jquery或knockout,但不能同时使用它。然而,当我看着别人的小提琴时,他们似乎没有这个问题。真烦人,不知道为什么它如此令人难忘,并且在互联网上没有任何搜索结果! 谢谢

4
如何防止在执行敲除绑定之前显示HTML
我在HTML中使用以下敲除脚本: <!-- kno ifnot: bla --> <tr><td>some stuff</td></tr> <!-- /ko --> 我的问题是在执行绑定之前,该行将显示一两秒钟。 如何防止这种情况发生?

2
绑定到简单的字符串数组
如果我想将模板绑定到一个普通的旧字符串数组,我该在$ {??}表达式中放什么? 我希望这段代码不要太短,以免引起混淆: <ul data-bind="template: { name: 'authorTemplate', foreach: authors }"> </ul> 作者在哪里 ["a", "b", "c"] <script type="text/x-jquery-tmpl" id="authorTemplate"> <li>${what_do_I_put_here???}</li> </script> 我试过了:val value this和this.toString()。最后两个显示了[object Object],所以我怀疑我离那儿很近。

1
使用数据绑定到图像src属性的删除模板不起作用
我看不到这里出了什么问题,但是使用以下的Knockout模板无法显示图片: <script type="text/html" id="legend-template"> <div><input type="checkbox" data-bind="click : doSomething" ></input> <img width="16px" height="16px" data-bind="src: 'imagePath'" /> <span data-bind="text : label"> </span> </div> </script> 绑定到的对象如下所示: tut.myObject= function (imagePath, label) { this.label = ko.observable(label); this.imagePath = ko.observable(imagePath || liveString + '/Content/images/marker.png'); }; tut.myObject.prototype = { doSomething: function () { alert("do what?"); } …

3
KnockoutJS中的$ data变量的来源和目的是什么?
在KnockoutJS教程中,我偶然发现了以下代码示例,其中包含无法解释的变量$data。 视图(html): <!-- Folders --> <ul class="folders" data-bind="template: { name: 'folderTemplate', foreach: folders }"></ul> <script type="text/html" id="folderTemplate"> <li data-bind="css: { selected: $data == mailViewModel.selectedFolder() }, click: function() { mailViewModel.selectFolder($data) }"> ${$data} </li> </script> 视图模型(JavaScript): var viewModel = { // Data folders: ['Inbox', 'Archive', 'Sent', 'Spam'], selectedFolder: ko.observable('Inbox'), // Behaviours selectFolder: …
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.