selectize.js 和 Shiny ：从远程 API 中选择选项

Question

由于事先没有 JavaScript 和 API 编程知识，我在使此示例满足我的需求时遇到了一些麻烦：选择 GitHub repo。我正在尝试使其适应此 API： https: //api-adresse.data.gouv.fr/search/？。

响应是一个 GeoJSON 文件，其中特征存储在 response$features 中。我想获取每个功能的properties$label 属性。

这是我到目前为止所做的。我得到一个数组，但项目未显示在下拉列表中......

用户界面：

########
# ui.R #
########

library(shiny)

fluidPage(
  title = 'Selectize examples',
  mainPanel(
    selectizeInput('addresses', 'Select address', choices = '', options = list(
      valueField = 'properties.label',
      labelField = 'properties.label',
      searchField = 'properties.label',
      options = list(),
      create = FALSE,
      render = I("
  {
    option: function(item, escape) {
      return '<div>' + '<strong>' + escape(item.properties.name) + '</strong>' + '</div>';
    }
  }"  ),
      load = I("
  function(query, callback) {
    if (!query.length) return callback();
    $.ajax({
      url: 'https://api-adresse.data.gouv.fr/search/?',
      type: 'GET',
      data: {
        q: query
      },
      dataType: 'json',
      error: function() {
        callback();
      },
      success: function(res) {
        console.log(res.features);
        callback(res.features);
      }
    });
  }"
     )
    ))
  )
)

服务器 ：

############
# server.R #
############

library(shiny)

function(input, output) {
  output$github <- renderText({
    paste('You selected', if (input$github == '') 'nothing' else input$github,
          'in the Github example.')
  })
}

感谢您的帮助。

Answer 1

感谢这个评论，让它工作了。

selectize 不支持使用点表示法访问嵌套值

用户界面：

########
# ui.R #
########

library(shiny)

fluidPage(
  title = 'Selectize examples',
  mainPanel(
    selectizeInput('addresses', 'Select address', choices = '', options = list(
      valueField = 'name',
      labelField = 'name',
      searchField = 'name',
      loadThrottle = '500',
      persist = FALSE,
      options = list(),
      create = FALSE,
      render = I("
  {
    option: function(item, escape) {
      return '<div>' + '<strong>' + escape(item.name) + '</strong>' + '</div>';
    }
  }"  ),
      load = I("
  function(query, callback) {
    if (!query.length) return callback();
    $.ajax({
      url: 'https://api-adresse.data.gouv.fr/search/?',
      type: 'GET',
      data: {
        q: query
      },
      dataType: 'json',
      error: function() {
        callback();
      },
            success: function (data) {
                callback(data.features.map(function (item) {
                    return {name: item.properties.name, 
                  label: item.properties.label,
                  score: item.properties.score};
                }));
            }


    });
  }"
     )
    ))
  )
)

服务器：

############
# server.R #
############

library(shiny)

function(input, output) {
  output$github <- renderText({
    paste('You selected', if (input$github == '') 'nothing' else input$github,
          'in the Github example.')
  })
}