Knockout JS - 在可观察数组中绑定对象的属性

Question

function OutletsView(){
  self = this;
  self.locations = ko.observableArray(<?php echo json_encode($locations); ?>);
}

ko.applyBindings(new OutletsView());

位置来自结构

[
{
  name: 'Demo',
  oid: 1,
  children: [
    {
      id: 2,
      name: 'de'
    },
    {
      id: 2,
      name: 'de'
    }
  ]
},
{
  name: 'Demo',
  oid: 1,
  children: [
    {
      id: 2,
      name: 'de'
    },
    {
      id: 2,
      name: 'de'
    }
  ]
}
]

我需要绑定 oid 并在 html 中进行更改

<script type="text/html" id="location-filter">
    <div>
        <div data-bind="text: oid"></div>
        <div>
            <ul data-bind="foreach: locations">
                <li data-bind="text: name, click: $parent.applyFilter(id, name, $parent)"></li>
            </ul>
        </div>
    </div>
</script>

所以我想改变 oid 但找不到怎么做 谁能帮帮我？

编辑：

function OutletsView(){
        self.locations = ko.observableArray([]);
        self.getChildLocations = function(id){
            $.post('<?=$this->url(array('controller' => 'location', 'action' => 'get-locations'), 'default', true); ?>',
                {id: id},
                function(data){
                    var parsed = $.parseJSON(data);
                    var item = new Location(parsed);
                    self.locations.push(item);
                }
            );
        }
    }
    function locationItem(el){
        tself = this;
        tself.id = el.id;
        tself.name = el.name;
        tself.lo_idx = el.lo_idx;
        tself.cls = ko.observable(el.cls);
    }

    function Location(item){
        kself = this;
        kself.using_id = 0;
        kself.using_name = item[0].location_type;
        kself.cls = ko.observable('jcsik jactive jsminimize');
        kself.locations = [
            new locationItem({id: 0, name: item[0].location_type, lo_idx: 0, cls: ''}),
            new locationItem({id: 1, name: 'Не выбрано', lo_idx: 0, cls: 'jexpand'})

        ];
        $.each(item, function(i, el){
            kself.locations.push(new locationItem(el));
        });
        kself.getLocation = function(){
            return kself;
        }
    }

Answer 1

您在导致中断的 foreach 循环之外绑定 oid 属性..

你可以改变方法并做类似的事情

<script type="text/html" id="location-filter">


        <div>
            <ul data-bind="foreach: locations">
                <li>
                   <span data-bind="text: oid"></span> : 
                   <span data-bind="text: name, click: $parent.applyFilter(id, name, $parent)"></span>
                </li>

            </ul>
        </div>
    </div>
</script>

Answer 2

首先你的 oid 在你的 foreach 循环之外，所以绑定在那个时候无法访问它，其次如果你想从 js 更新 oid，它需要是一个可观察的

两个选项。

1. 使用 ko.mapping 插件将属性转换为可淘汰的 observables

   函数 OutletsView(){ 自我=这个； self.locations = ko.observableArray(ko.mapping.fromJS()); }

您需要引用 ko.mapping.js 插件，缺点是它会将所有属性转换为 ko 属性

1. 创建您自己的转换方法来转换您希望可观察的属性。

类似的东西

function OutletsView(){
  self = this;
  self.locations = ko.observableArray(toKO(<?php echo json_encode($locations); ?>));
}

function toKO(arr){
    var retObj = []
    for(var i = 0; arr.length, i++){
       retObj.push([
         name: ko.observable(arr[i].name)
         oid: ko.observable(oid);
         /// and on and on
       });
   }
   return retObj;
}