Множественный объектный массив не работает в At.js - PullRequest
Новая
       31

Множественный объектный массив не работает в At.js

0 голосов
/ 07 октября 2018

Я использую плагин At.js .Он отлично работает для одного объекта ( demo ) 

var names1 = ["Jacob", "Isabella", "Ethan", "Emma", "Daniel", "Madison"];
var names = $.map(names1, function(value, i) {
  return {
    'id': i,
    'name': value,
    'email': value + '@yahoo.com'
  };
});

Но когда я пытаюсь добавить несколько объектов, он не работает ( demo ).Я знал, что код является проблемой.Я хочу отобразить описание, когда пользователь выбирает имя человека, используя тег @. 

$(function() {
  $.fn.atwho.debug = true

  var names1 = [{
      "name": "Jacob",
      "description": "description one description one description one"
    },
    {
      "name": "Isabella",
      "description": "description two description two description two"
    }
  ];

  var names = $.map(names1, function(value, description, i) {
    return {
      'id': i,
      'name': value,
      'email': description
    };
  });

  var at_config = {
    at: "@",
    data: names,
    headerTpl: '<div class="atwho-header">Service List <small>↑&nbsp;↓&nbsp;</small></div>',
    insertTpl: '${email}',
    displayTpl: "<li>${name}</li>",
    limit: 200
  }
  $inputor = $('#inputor').atwho(at_config);
  $inputor.caret('pos', 47);
  $inputor.focus().atwho('run');
});

1 Ответ

0 голосов
/ 07 октября 2018

Функция map в Jquery не принимает каждый элемент объекта в качестве аргумента функции, вы получаете весь объект (элемент в списке), а затем вам нужно извлечь имя и описание.Вы были почти там. 

$(function() {
  $.fn.atwho.debug = true

  var names1 = [{
      "name": "Jacob",
      "description": "description one description one description one"
    },
    {
      "name": "Isabella",
      "description": "description two description two description two"
    }
  ];

  var names = $.map(names1, function(value, index) { //Here I have only used value
    return {
      'id': index,
      'name': value.name, //Here I take value.name from the object
      'email': value.description //And value.description from the object
    };
  });

  var at_config = {
    at: "@",
    data: names,
    headerTpl: '<div class="atwho-header">Service List <small>↑&nbsp;↓&nbsp;</small></div>',
    insertTpl: '${email}',
    displayTpl: "<li>${name}</li>",
    limit: 200
  }
  $inputor = $('#inputor').atwho(at_config);
  $inputor.caret('pos', 47);
  $inputor.focus().atwho('run');
});
...