在多個模型中訪問Knockoutjs中的部分數據

我只想了解爲什麼Knockout.js不允許我訪問模型數據的一部分。是因爲我將模型綁定到包含所有子模型的div（本例中的Form）還是我認爲它是錯誤的？在多個模型中訪問Knockoutjs中的部分數據

例如，在此的jsfiddle http://jsfiddle.net/zv6hauft/1/

我想救就票價信息，但離開了公交車的信息。所以即使我只是通過示例中的「票價」，它會向我顯示控制檯中的所有模型。

<!doctype html> 
<script src="/javascript/knockout-3.3.0.js"></script> 
<form id="transport_form" method="post"> 
    <table class="table table-condensed required" data-bind='visible: bus_lines().length > 0'> 
     <thead> 
      <tr> 
       <th>Bus</th> 
      </tr> 
     </thead> 
     <tbody data-bind='foreach: bus_lines'> 
      <tr> 
       <td> 
        <input name="bus_date" type="text" class="bus_date" value=" " data-bind='value: bus_desc' required/> 
       </td> 
       <td><a href='#' id="bus_remove" data-bind='click: $parent.removeBusLine'>Delete</a> 
       </td> 
      </tr> 
     </tbody> 
    </table> 
    <div class="controls"> 
     <button id="bus_button" data-bind='click: addBusLine'>Add Bus</button> 
    </div> 
    <div id="fare_info_table"> 
     <table data-bind='visible: fare_lines().length > 0'> 
      <thead> 
       <tr> 
        <th>Fare</th> 
       </tr> 
      </thead> 
      <tbody class="table required" data-bind='foreach: fare_lines'> 
       <tr> 
        <td> 
         <input id="fare_amnt" data-bind='value: fare_desc' required /> 
        </td> 
        <td><a href='#' id="fare_remove" data-bind='click:$parent.remove_fare_line'>Delete</a> 
        </td> 
       </tr> 
      </tbody> 
     </table> 
     <div class="controls"> 
      <button id="fare_button" data-bind='click: add_fare_line'>Add fare</button> 
     </div> 
    </div> 
    </br> 
    </br> 
    <div class="control-group"> 
     <div class="controls"> 
      <button type='submit' data-bind="click: save_record">Submit</button> 
     </div> 
    </div> 
</form> 

</html> 



<script> 


//Bus Model 
var Bus_model = function() { 
    var self = this; 
    self.bus_desc = ko.observable(); 
}; 



var fare_model = function() { 
    var self = this; 
    self.fare_desc = ko.observable(); 
} 

var operations_bus_fare = function() { 

    var self = this; 

    //Study Schedule Operations 
    self.bus_lines = ko.observableArray([new Bus_model()]); 
    self.addBusLine = function() { 
     self.bus_lines.push(new Bus_model()) 
    }; 
    self.removeBusLine = function (Bus_line) { 
     self.bus_lines.remove(Bus_line) 
    }; 

    //Fare operations 
    self.fare_lines = ko.observableArray([new fare_model()]); 
    self.add_fare_line = function() { 
     self.fare_lines.push(new fare_model()) 
    }; 
    self.remove_fare_line = function (fare_line) { 
     self.fare_lines.remove(fare_line) 
    }; 




    self.save_record = function (fare_lines) { 
     var saveData2 = ko.toJSON(fare_lines); 
     console.log(saveData2); 
     alert(saveData2); 
    }; 
}; 

ko.applyBindings(new operations_bus_fare(), document.getElementById("transport_form")); 

</script>

來源

2015-02-24 deepseas

其簡單'你逝去的save_record'功能總視圖模型。所以爲了訪問它的一部分只顯示'fare_lines'嘗試像這樣http://jsfiddle.net/zv6hauft/2/。乾杯 – 2015-02-25 06:06:15

您可以訪問視圖模型的一部分，我做這樣的

視圖模型：

self.save_record = function (data) { // we get entire vm here as param 
    var saveData2 = ko.toJSON(data.fare_lines); // access required part 
    console.log(saveData2); 
    alert(saveData2); 
};

工作撥弄here

來源

2015-02-25 06:53:06

在多個模型中訪問Knockoutjs中的部分數據

回答

相關問題