Question

我有以下JSON对象，它维护序列。

＆＃13;

var sample={
  "sample": [
    {
      "example": [
        {
          "sequence": 1, 
        },
        {
        	"sequence":2
        },
        {
        	"sequence":3
        }
      ]
    },
     {
      "example": [
        {
         "sequence": 1,
      
        }
      ]
    }
    ]
    };
         $.templates("testingTemplate", "#testingSection");
	
var html=$.link.testingTemplate("#htmlHolder", sample);
$("#insert").click(function(){
var childIndexVal=parseInt($("#childIndex").val());
var x= {
          "sequence": childIndexVal+1,
          "xxx":"yyy"
        };
var parentIndexVal=parseInt($("#parentIndex").val());

$.observable(sample.sample[parentIndexVal].example).insert(childIndexVal,x);
console.log(sample);
});

＆＃13;

.parentHolder
{
  border:1px solid red;
  padding:5px;
  margin:5px;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jsviews/0.9.80/jsviews.js"></script>
<script id="testingSection" type="text/x-jsrender">

{{if sample && sample.length}}
	
	{^{for sample }}
  <div class="parentHolder">
  	{^{for example }}
      <div><span data-link="#index+1" ></span>
      <input type="text" value="{{:sequence}}" id="sequence" data-link="#index+1"></div>
    {{/for}}
     </div>
  {{/for}}

 {{/if}}
 </script>
 <div id="htmlHolder">
 
 </div>
 <div class="messages">
 
 </div>
 <span>Parent Index:</span><input type="text" id="parentIndex"/>
 <span>Child Index:</span><input type="text" id="childIndex"/>
 <button id="insert" >Insert</button>

＆＃13;

所以每当我插入对象时，它都应该更新索引的序列。

在给定的例子中，如果我将一个对象插入sample [0]中示例的第一个索引。（考虑示例数组索引从零开始）。

因此，当我将一个对象插入第一个参数时，剩余对象中的序列应根据索引进行更新。

我怎样才能实现它。

将父索引设为0，将子索引设为1。

预期产出，

注意：额外＆＃34; xxx＆＃34;：＆＃34; yyy＆＃34;出于差异目的。

var sample={
  "sample": [
    {
      "example": [
        {
          "sequence": 1, 
        },
    {
        "sequence": 2, 
         "xxx":"yyy"
    }
        {
            "sequence":3
        },
        {
            "sequence":4
        }
      ]
    },
     {
      "example": [
        {
         "sequence": 1,

        }
      ]
    }
    ]
    };

更新：尝试使用 linkTo 。

<input type="text"   data-link="linkTo=sequence #index+1" ></div>

仍未获得预期的输出。提前谢谢。

Answer 1

JsRender和JsViews都不会修改它们呈现的JSON数据。这是设计的：数据没有副作用......

另一方面，您可以编写代码来创建数据的副作用，也可以使用双向绑定，以便用户可以修改数据值。但双向绑定只会更改目标数据值，而不会更改其他位置的其他值，并且仅在用户触发<input>上的更改事件时才会这样做。

在您的情况下，您希望对examples数组进行任何可观察的更改，以触发对数组中所有examples的更改，以确保example.sequence值始终等于{{每个index+1 1}}。在这种情况下，你必须编写代码才能做到这一点。

您可以实现的一种方法是使用observeAll添加以下代码：

example

这将确保$.observable(sample).observeAll(function(ev, eventArgs) { if (ev.type==="arrayChange" && ev.data.observeAll.path().slice(-7)==="example") { $.each(ev.currentTarget, function(i, item) { $.observable(item).setProperty("sequence", i+1); }) } });值不仅与插入保持同步，而且还在删除项目或更改项目顺序等时保持同步。

如何使用json对象对索引进行数据链接？

1 个答案: