Question

我有一个来自ajax调用的json数据集，我使用foreach将其绑定到div。这是一个样本数据集

[{"contact":"123054","type":"4","value":"vikasverma21%40gmail.com;","id":"123054","userid":"snstestbuild003@gmail.com","last_update":"1389607937995","status":"N","photo_type":null,"importance":null,"sensitivity":null,"subject":null,"folder":null,"anniversary":null,"first_name":"%5C%2F%21k%40%24+.","middle_name":"","last_name":"","display_name":null,"birthday":"1900-01-01","body":";","categories":"","children":null,"hobbies":null,"initials":null,"languages":null,"nickname":null,"spouse":null,"suffix":"","title":"","gender":null,"assistant":null,"company":"","department":"","job_title":";","manager":null,"mileage":null,"office_location":null,"profession":null,"companies":null},{"contact":"123032","type":"4","value":"asifkhn617%40gmail.com;","id":"123032","userid":"snstestbuild003@gmail.com","last_update":"1389607937995","status":"N","photo_type":null,"importance":null,"sensitivity":null,"subject":null,"folder":null,"anniversary":null,"first_name":"%C2%B0%E1%83%A6%E2%80%A2%C3%81%C5%9A%E2%84%90%C5%A6+%C3%81%E2%84","middle_name":"","last_name":"","display_name":null,"birthday":"1900-01-01","body":";","categories":"","children":null,"hobbies":null,"initials":null,"languages":null,"nickname":null,"spouse":null,"suffix":"","title":"","gender":null,"assistant":null,"company":"","department":"","job_title":";","manager":null,"mileage":null,"office_location":null,"profession":null,"companies":null},{"contact":"123028","type":"3","value":"%2B919407568901;","id":"123028","userid":"snstestbuild003@gmail.com","last_update":"1389607933269","status":"N","photo_type":null,"importance":null,"sensitivity":null,"subject":null,"folder":null,"anniversary":null,"first_name":"%E0%AE%90%E0%B8%84%E0%B8%A0%D0%BA%E0%B9%80t%E0%AE%90+%E2%97%8F%E","middle_name":"","last_name":"","display_name":null,"birthday":"1900-01-01","body":";","categories":"","children":null,"hobbies":null,"initials":null,"languages":null,"nickname":null,"spouse":null,"suffix":"","title":"","gender":null,"assistant":null,"company":"","department":"","job_title":";","manager":null,"mileage":null,"office_location":null,"profession":null,"companies":null}]

这是与html绑定的绑定部分

<div data-bind="foreach: {data: Contacts}">
        <div class="srch_contnt gray_bg" >
          <div class="srch_contnt_icon"></div>
          <div class="srch_contnt_heading"><span data-bind="text: urldecode(first_name)"></span><span data-bind="text: urldecode(last_name)"></span></div>
          &nbsp<span data-bind="text: decodeURIComponent(value.replace(';', ''))"></span> </div></div>

first_name和last_name属性在来自服务器时是urlencoded，并且在绑定时被urldecoded，这对于普通名称非常有效，最近我开始在诸如

之类的字段中获得奇怪的名称

°ღ•ÁŚℐŦÁ

实际上，当网址编码看起来像

时

％C2％B0％E1％83％A6％E2％80％A2％C3％81％C5％9A％E2％84％90％C5％A6 +％C3％81％E2％84

现在，如果我有3个联系人，第一个具有正确名称的联系人显示得很好，而第二个具有这种奇怪角色的联系人根本不会显示，可能就是它崩溃的地方，之后即使有好的联系人集合中的姓名，没有其他内容出现。

Answer 1

创建一个计算机绑定模型，如此...

self.cleanLastName = ko.computed(function(){
   // RETURN A CLEANED UP NAME HERE... maybing using encodeURIComponent()
}

绑定到此功能。如果您信任我们的源代码，您可能还想尝试使用“html”而不是“text”进行绑定... html绑定有点宽容。

Answer 2

修正了它，

此特定字符串引发了“格式错误的URI序列”

类型的异常

我创建了一个可以在try catch

中处理此功能的函数

function urldecodeSafe(inputValue)
{
  var retVal;
  try
  {    
    retVal = urldecode(inputValue);    
  }
  catch(err)
  {
    retVal = "No Name";
  }
  return retVal;
}

并将其用作

<a class="ContactDetails" href="#ContactDetails" rel="#ContactDetails" data-bind="click: $parent.PickDataWithNumber">
              <div class="list_container gray_bg mrgT3px" >
              <div class="list_contact_icon" ></div>
              <div class="contact_name" ><span data-bind="html: urldecodeSafe(first_name)"></span> <span data-bind="html: urldecodeSafe(last_name)"></span></div>
              <div class="contact_number"><span data-bind="text: decodeURIComponent(value.replace(';', ''))"></span></div>

urldecode with knockout binding，打破不可打印的字符，如ÁŚℐŦÁ

2 个答案: