如何将mvvm可见和文本属性绑定到子项剑道ui菜单
我正在尝试将可见属性和文本绑定到剑道ui菜单。我使用MVVM框架。当我在viewModel子菜单项中更改属性时不可见不工作。这是我的:如何将mvvm可见和文本属性绑定到子项剑道ui菜单,mvvm,menu,kendo-ui,Mvvm,Menu,Kendo Ui,我正在尝试将可见属性和文本绑定到剑道ui菜单。我使用MVVM框架。当我在viewModel子菜单项中更改属性时不可见不工作。这是我的: 不将值分配给属性调用,而是像下面这样设置可观察方法set: var\u this=this; 此.set(“用户名”、“Jane Smith”); 此.set(“isLogin”,true) 直接分配给属性不允许更改事件通过绑定传播 另外,不必将两个元素的可见性绑定到两个属性,因为它们彼此相关,您可以将visible和invisible绑定到同一属性 感谢您的
不将值分配给属性调用,而是像下面这样设置可观察方法
set
:
var\u this=this;
此.set(“用户名”、“Jane Smith”);
此.set(“isLogin”,true)代码>
直接分配给属性不允许更改事件通过绑定传播
另外,不必将两个元素的可见性绑定到两个属性,因为它们彼此相关,您可以将visible
和invisible
绑定到同一属性
感谢您的修复和建议。我改变了我的想法,现在一切正常!
<ul id="menu" data-role="menu">
<li>
<span class="fa fa-globe"></span>
Map
<ul>
<li><a href="#/home/index"><span class="fa fa-home"></span>Index</a></li>
<li><a href="#/home/about"><span class="fa fa-info"></span>Info</a></li>
</ul>
</li>
<li data-bind="visible: isLogout">
<a href="#" data-bind="click: logIn">
<span class="fa fa-sign-in"></span>
Log in
</a>
</li>
<li data-bind="visible: isLogin">
<span class="fa fa-user"></span>
<span data-bind="text: userName"></span>
<ul>
<li><a href="#"><span class="fa fa-key"></span>Change password</a></li>
<li><a href="#"><span class="fa fa-tags"></span>Refresh token</a></li>
<li class="k-separator"></li>
<li><a href="#"><span class="fa fa-sign-out"></span>Log out</a></li>
</ul>
</li>
</ul>
var viewModel = kendo.data.ObservableObject({
isLogin: false,
isLogout: true,
userName: "",
logIn: function(e) {
//var text = $(e.item).children(".k-link").text();
this.userName = "Jane Smith"; //John Smith
this.isLogin = true;
this.isLogout = false;
}
});
kendo.bind($("#menu"), viewModel);