Question

我有一些关于在淘汰赛中分离json数据的问题。

以下是json数据的示例。

var data = [{"ID":"84F37B0F28374A2B813650079DF45697","LogicalName":"TM1.Application","Name":"Key Performance Indicators (KPIs)","ColumnValue":"blabla."},
{"ID":"C49C30D66E834344B57C18E8693B2A55","LogicalName":"TM1.Cube","Name":"KPI","ColumnValue":"KPI"},
{"ID":"45A8A5F9074644728DFE7901626212E6","LogicalName":"TM1.Process","Name":"Data.KPI.LoadKPIFromAssets","ColumnValue":"blabla."}];

是否可以将数据分成不同的模型。我想在最后完成的是能够基于logicalName分离href。

例如下面，cubesingle和Cube将取决于返回的LogicalName。

<td data-bind="text: $data.LogicalName"></td>
<td><a data-bind="attr: { href: './Documentation/Model Documentation/cubesingle.html?api==Cube('+$data.ID()+')' }, text: $data.Name"></a></td>                                
<td data-bind="text: $data.ColumnValue"></td>

这是jsFiddle http://jsfiddle.net/3c0aaq07/1/

我可以使用淘汰赛foreach。但我想知道我是否可以在淘汰之前先拆分数据。

谢谢

Answer 1

这种方法怎么样。

Html Page

 <!DOCTYPE html>
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title></title>
    </head>
    <body>
        <div id="container1"></div>
        <div id="container2">
            <table>
                <!-- ko foreach: myItems -->
                <tr>
                    <td data-bind="text: $data.LogicalName"></td>
                    <td>
                        <a data-bind="attr: { href: './Documentation/ModelDocumentation/cubesingle.html?api==Cube('+$data.ID()+')' }, text: $data.Name"></a>
                    </td>
                    <td data-bind="text: $data.ColumnValue"></td>
                </tr>
                <!-- /ko -->
            </table>
        </div>


        <script src="js/jquery.js"></script>
        <script src="js/knockout.js"></script>
        <script src="js/DataFunction.js"></script>
        <script src="js/MasterViewModel.js"></script>

    </body>
    </html>

MasterViewmodel.js

    function MasterViewmodel()
    {
      var self = this;
      var item = function(ID, Name, Description){
        var $this = this;
        self .ID = ko.observable(ID);
        self .LogicalName = ko.observable(LogicalName);
        self .Name = ko.observable(Name);
        self .ColumnValue = ko.observable(ColumnValue);
      }
      self.myItems = ko.observableArray();

      self.UpdateYourTable = function () {
        $.support.cors = true;
        $.getJSON(**yourURL**)
        .done(function (succesdata) {
                if (succesdata!= null) {
                    secondVM.SetJasonData(succesdata);

                }
            })
        .fail(function (xhr, status, error) {
            //console.log(xhr);
            //console.log(status);
            //console.log(error);
        });
    };
    self.UpdateYourTable();
    }

然后在主视图模型在DataFunction.js中注册为单独的视图模型

之后

var masterVM;
var secondVM;
$(document).ready(function() {

    if ($.isEmptyObject(masterVM)) {
        masterVM= new MasterViewmodel();
        ko.applyBindings(masterVM, document.getElementById("container1"));
    }
    if ($.isEmptyObject(secondVM)) {
        secondVM= new SecondViewmodel();
        ko.applyBindings(secondVM, document.getElementById("container2"));
        //Here we are registering a new view model for container2 div
    }

});

SecondVeiwModel.js

function SecondViewmodel()
{
    var self = this;

    self.SetJasonData = function(data){
        //Do what ever you want to do with jason data here
        ko.utils.arrayForEach(data, function(itemData) {
              self.myItems.push(new item (
              itemData.ID ,
              itemData.LogicalName ,
              itemData.Name ,
              itemData.ColumnValue 
           ));
        });
    }
}

希望这可以帮助您解决问题。

Knockout过滤json数据

1 个答案: