淘汰将数据传输到多视图

Question

下面是我的代码，它是knocokout js，我有ListviewModel，它与两个视图相关，第一个和第二个视图如下所示，两个视图使用类名 UserDetailsView ，我绑定两个视图第一个和第二个视图如下，我的问题是，我在第一个视图上点击事件＆＃34; Userview＆＃34;我需要获取点击事件的数据 $ root.UserView ，当我点击它时它应该获得所有相关值并传递到第二个视图，这样我就可以使用 knockout js <绑定数据/ strong>，当我点击 $ root.UserView 时，我得到了值但无法绑定数据所以我在第二个视图中使用jquery进行绑定，但现在需求已更改我需要再次点击事件在第二个视图中所以我可以将数据传送到另一个视图，在此之前我需要用Knockout js绑定第二个视图如何才能完成需要帮助

 function ListviewModel()
{
var self = this;
self.Listarray = ko.observableArray();
self.getUserList = function () {  
    var ListModel = {
        userId: UserID
    }
    jQuery.support.cors = true;
    $.ajax({
        type: "POST",
        dataType: "json",
        contentType: 'application/json; charset=utf-8',
        data: JSON.stringify(ListModel),
        url: serverUrl + 'xxx/xxx/xxx',
        success: function (data) {

            self.Listarray($.map(data, function (item) {
                return new Listdata(item);
            }));
        }
    });
};

  //Click Function for UserPersonalview
 self.UserView = function (Listarray) {
    $("#userId").text(Listarray.userIdId());
    $("#userName").text(Listarray.UserName())
    document.getElementById('userProfilePic').setAttribute('src', "data:" +   Listarray.ProfilePictype() + ";base64," + Listarray.ProfilePicBase64());
    window.location.href = "#UserPersonalview";
}
self.UserProfile = function () {
    console.log(self.Listarray());

  }
  }

  //Model
  function Listdata(data)
 {    
 var self = this;
self.userId = ko.observable(data.userId);
self.userName = ko.observable(data.userName);
self.userProfilePicBase64 = ko.observable(data.userProfilePicBase64);
self.userProfilePictype = ko.observable(data.userProfilePictype);
self.userProfilepic = ko.computed(function () {
    return "data:" + self.userProfilePictype() + ";base64," +    self.userProfilePicBase64();
      }); 
    }



      //1st View

 <div data-role="view" id="Userview" class="UserDetailsView" data-layout="default">

  <div data-role="content" style="background-color:#fff!important">    
 <div>

  <ul style="list-style: none;" data-role="listview" id="hierarchical-listview" data-bind="foreach:Listarray">

  <li style="background-color:#FFF" data-bind="click:$root.UserView">

  <div style="width:100%;">
  <div style="width:50%;float:left">
  <span data-bind="text:$data.userId" style="display:none"></span>
  <img data-bind="attr: { src:$data.userProfilepic }" onclick="Imagepopover()" />
  <label style="width: 25%!important;" class="firendslisttext" data-bind="text:$data.userName"></label>
   </div>

   <div style="width:50%;float:left;margin: 0px -20px;">    
   </div>
   </div>
   </li>
   </ul>
  </div>   
    </div>
    </div>

   //second View
  <div data-role="view" id="UserPersonalview"  >
   <header data-role="header">
   <div data-role="navbar" class="UserDetailsView">
   <div class="content-header ">
   <ul style="list-style: none;" >
    <li data-bind="click:$root.UserProfile">
     <div class="km-leftitem">
    </div>
     <div class="block2" >
       <div class="inner" style="float:left" >
       <span id="userId" style="display:none"></span>
        <img data-responsive="" width="40" height="40" id="userProfilePic" src="" style="border-radius: 50%;" />
        </div>
      <div class="inner" style="float:left;margin-left:15px">
       <label id="userName" style="width: 100%!important;"></label>
        </div>
       </div>
       <div class="km-rightitem">
       <a data-align="right"><img src="images/icon-add.png" style="height:50px" /></a>
         </div>
          </li>
          </ul>
            </div>
        </div>

       </header>

    <div data=role="content"><div>
</div>