点击事件在第二个foreach中没有绑定

-1

为什么我的点击事件在第二个foreach中不起作用？点击事件在第二个foreach中没有绑定

我的HTML：

<div class="row" id="menuBody" data-bind="foreach:categoryArray"> 
    <div class="outer col-md-2" data-bind=" attr:{id:id},event:{mouseover :$parent.mouseOverKnockout,mouseout:$parent.mouseOutKnockout }"> 
     <div class="inner col-md-12"> 
      <label class="label" data-bind="text:name"> </label> 
      <div class="children" data-bind="css:{changeTopChildren: changeTopChildren}"> 
       <ul data-bind="foreach:$parent.items1" class="childrenUl"> 
        <li data-bind=" text: name,attr:{id:id},click: $parent.selectLi" class="childrenLi col-md-12"></li> 
       </ul> 
      </div> 
     </div> 
    </div> 
</div>

我的脚本：

var modelCategory = function (id, name) { 
    var self = this; 
    self.changeTopChildren = ko.observable(false); 
    self.name = ko.observable(name); 
    self.id = ko.observable(id); 

} 
var modelProduct = function (id, name) { 
    var _self = this; 
    _self.name = ko.observable(name); 
    _self.id = ko.observable(id); 
    _self.selectLi = function() { 
     alert("li"); 
     console.log(" selectLi"); 
    }; 
} 
    var viewModelMenuBody = function() { 
    var self = this; 
    self.selectLi = function (tag) { 
     alert("li"); 
     console.log(" selectLi"); 
    }; 
    self.categoryArray = ko.observableArray(); 
    self.items1 = ko.observableArray(); 
    var temp = null; 

    self.mouseOverKnockout = function (arg, e) { 
     temp = arg;  
     for (var i = 0; i < self.categoryArray().length; i++) { 
      self.categoryArray()[i].changeTopChildren(false); 
     } 
     arg.changeTopChildren(true);  
      $.getJSON("/Home/getChildrenForMenu", { id: arg.id }, function (rowProduct) { 
      self.items1.removeAll(); 
      for (var total = 0; total < rowProduct.length; total++) { 
       var temp = new modelProduct(); 
       temp.id(rowProduct[total].id); 
       temp.name(rowProduct[total].name); 
       self.items1.push(temp); 
      } 
     }); 
    } 

    self.mouseOutKnockout = function (arg) { 

     if (arg!=null) 
    arg.changeTopChildren(false); 

     //else 
     // temp.changeTopChildren(false); 

    }; 

    (function() { 
     $.getJSON("/Home/getDataForMenu", null, function (rowCategory) { 

      for (var total = 0; total < rowCategory.length; total++) { 
       var temp = new modelCategory(); 
       temp.id(rowCategory[total].id); 
       temp.name(rowCategory[total].name); 
       self.categoryArray.push(temp); 
      } 
     }); 
    })(); 
}; 

var viewModel1 = new viewModelMenuBody(); 
ko.applyBindings(viewModel1, document.getElementById('menuBody'));

来源

2016-01-14 reza

你已经张贴*很多*的代码，这样一个小问题。请将代码修剪到最小的代码。如果你告诉我们什么“不工作”的含义（错误，调试信息等），以及你到目前为止所尝试和研究的内容，这也会有所帮助。 – Jeroen

所有的方法都是根视图模型对象中定义。因此$parent.selectLi来自嵌套foreach的呼叫将不起作用，因为$parent上下文指的是外部foreach的当前项目。

改为使用$root.selectLi。

来源

2016-01-14 07:10:19

点击事件在第二个foreach中没有绑定

回答

相关问题