knockout.js hrefコンテキストのobservablearrayからのアクセス要素

Question

＃スクロールラッパー{ マージン：5px; 最大高さ：250ピクセル;オーバーフロー：自動; vertical-align：top; }

#thumbnails { 
    vertical-align: top; 
    padding-bottom: 10px; 
    max-height: 500px; 
    min-width: 100px; 
    overflow-y: hidden; 
    overflow-x: scroll; 
    white-space: nowrap; 
} 


.thumbnail-container { 
    display: inline-block; 
    position: relative; 
    line-height: 5px; 
    margin: 3px; 
    margin-bottom: 15px !important; 
} 
#abc { 
    overflow-y: scroll; 
    overflow-x: hidden; 
    height: 200px; 
} 

<form method="post"> 
    <div data-bind="foreach: lists" id="thumbnails"> 
     <div class="thumbnail-container"> 
      <span data-bind="text:listname"></span><br /><br /><br /><br /><br /> 
      <div id="abc"> 
       <ul class="list-group" data-bind="foreach: cardlists"> 
        <li class="list-group-item"> 
         <span data-bind="text: cardname"></span> 

        </li> 
       </ul> 
       <a href="#" data-bind="click: $parent.showhideaddcard">Add Card</a><br /> 
       <div data-bind="visible: showRenderTimes"> 
        <input type="text" data-bind="value: $parent.cardtext" /><br /><br /><br /> 
        <input type="button" value="Add" data-bind="click: $parent.addcard" /> 
        <input type="button" value="Cancel" data-bind="click: $parent.cancelcard" /> 
       </div> 
      </div> 
     </div> 
    </div> 
    <p> 
     <span id="addVar" data-bind="click: addList">Add List</span> 
    </p> 

    <p class="alignRight"> 
     <input type="submit" value="Check"> 
    </p> 
</form> 

これはshowhideaddcardボタンコンテキストでリストに観察配列にshowRenderTimesにアクセスする方法を私のコード

var ListModal = function(lists) { 
    var self = this; 
    self.cardtext = ko.observable(); 
    self.lists = ko.observableArray(ko.utils.arrayMap(lists, function (list) { 
     return { listname: list.listname, cardlists: ko.observableArray(list.cardlists), showRenderTimes: ko.observable(false) }; 
    })); 


    self.addList = function() { 
     self.lists.push({ 
      listname: "asdasdasd asdasd", 
      cardlists: ko.observableArray([ 
       { 
        cardname: "card 1" 
       }, 
       { 
        cardname: "card 2" 
       }, 
       { 
        cardname: "card 3" 
       } 
      ]), 
      showRenderTimes: false 

     }); 
    }; 


    self.showhideaddcard = function (list) {   
     self.showRenderTimes(true); // problem is here 
    };  

    self.save = function() 
    { 


    }; 
}; 

？です。

Answer 1

最初にaddList関数を変更し、self.listの初期化時にオブザーバブルオブジェクトとして設定するため、をオブザーバブルオブジェクトにする必要があります。

showRenderTimes: ko.observable(false) 

が、これはあなたがshowhideaddcard関数にデータを渡す方法

<a href="#" data-bind="click: $parent.showhideaddcard($data())">Add Card</a><br /> 

であるあなたは、私がshowRenderTimesに値を設定することができますどのようにこの

self.showhideaddcard = function (list) {   
    list.showRenderTimes(true); 
};