淘汰过滤器json数据

Knockout filter json data

本文关键字:数据 json 过滤器 淘汰      更新时间:2024-02-12

我对敲除时分离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。

例如下面的示例,其中立方体的角度和立方体将取决于返回的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>

这是jsFiddlehttp://jsfiddle.net/3c0aaq07/1/

我可以用击倒对手的前臂来完成。但我想知道我是否可以在淘汰赛之前先把数据分开。

感谢

这种方法怎么样。

Html页面

 <!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 
           ));
        });
    }
}

希望这能帮助你解决你的问题。