javascript - 如何从列表内的目录中取出值？

Question

我在代码中使用 JSON、Java 和 polymer 。

当按下我的按钮时，将调用一个函数，并且 java 后端将发送一个“教师”列表。它在我的网站上打印出来，如下所示:

代码:

 handleAjaxResponse(result) {
    this.$.response_text.textContent = JSON.stringify(result.detail.response.docenten);

结果:

[{"docentnaam":"Alex"},{"docentnaam":"Jos"},{"docentnaam":"Dick"},{"docentnaam":"Annemarije"},{"docentnaam":"Martijn"},{"docentnaam":"John"},{"docentnaam":"Bart"},{"docentnaam":"Bart"},{"docentnaam":"Peter"},{"docentnaam":"Dietske"},{"docentnaam":"Peter"}]

它似乎是列表中的目录，我不需要所有这些信息。我唯一需要的是目录内的值。

我的 Java 代码:

	public void handle(Conversation conversation) {
		JsonObject jsonIn = (JsonObject) conversation.getRequestBodyAsJSON();
		String name = jsonIn.getString("user");
		JsonObjectBuilder objBuilder = Json.createObjectBuilder();
		objBuilder.add("message", "The server says: Hi " + name + "!");
		JsonArrayBuilder docentenlijst = Json.createArrayBuilder();
		informatieSysteem.getDocenten().forEach(docent -> docentenlijst.add(Json.createObjectBuilder().add("docentnaam", docent.getVoornaam()).build()));
		objBuilder.add("docenten", docentenlijst.build());
		conversation.sendJSONMessage(objBuilder.build().toString());
	}

我尝试了很多方法来找出如何从中获取值，但没有任何帮助。我希望有人能帮助我。非常感谢。

polymer/html:

<link rel="import" href="../../bower_components/polymer/polymer.html">
<link rel="import" href="../../bower_components/paper-radio-button/paper-radio-button.html">
<link rel="import" href="../../bower_components/paper-radio-group/paper-radio-group.html">
<link rel="import" href="../../bower_components/paper-input/paper-input.html">
<link rel="import" href="../../bower_components/paper-button/paper-button.html">
<link rel="import" href="../../bower_components/iron-ajax/iron-ajax.html">

<dom-module id="my-presentie">
  <template>
    <style>
      :host {
        display: block;
      }

      #lijst {
      position: fixed;
      left: 550px;
      top: 300px;
      }
      #studentenlijst {
      position: fixed;
      left: 850px;
      top: 280px;
      }
    </style>
    <div id="lijst">
      <paper-radio-group selected="klas">
      <paper-radio-button name="v1b">V1B-ICT</paper-radio-button><br>
      <paper-radio-button name="v1c">V1C-ICT</paper-radio-button><br>
      <paper-radio-button name="v1d">V1D-ICT</paper-radio-button><br>
      <paper-radio-button name="v1e">V1E-ICT</paper-radio-button>
    </paper-radio-group>
    <paper-button on-click="clickHandler">Volgende</paper-button><br/>

	</div>

  <div id="studentenlijst">
    <paper-input label="Uw naam:" value="{{name}}"></paper-input>
    <p>Studenten: <span id="response_text"></span></p>
  </div>

   <iron-ajax id="studentenlijst_call" method="POST" url="/example" handle-as="json" on-response="handleAjaxResponse"></iron-ajax>

  </template>

<script>
 /**
 * @customElement
 * @polymer
 */
 class WebappApp extends Polymer.Element {
  static get is() { return 'my-presentie'; }
  static get properties() {
    return {
      name: {
        type: String,
        value: ''
      }
    };
  }
  clickHandler() {
    this.$.studentenlijst_call.contentType="application/json";
    this.$.studentenlijst_call.body = { "user": this.name };
    this.$.studentenlijst_call.generateRequest();
  }

  handleAjaxResponse(result) {
    this.$.response_text.textContent = JSON.stringify(result.detail.response.docenten);
  }
}
window.customElements.define(WebappApp.is, WebappApp);
</script>

</dom-module>

Answer 1

您可以简单地使用 array.map 方法；

 handleAjaxResponse(result) {
    var r = result.detail.response.docenten;
    this.$.response_text.textContent = r.map(o=> {return o.docentnaam;})
  }

<div id="test">Test</div>
<script>
var docents = [{"docentnaam":"Alex"},{"docentnaam":"Jos"},{"docentnaam":"Dick"},{"docentnaam":"Annemarije"},{"docentnaam":"Martijn"},{"docentnaam":"John"},{"docentnaam":"Bart"},{"docentnaam":"Bart"},{"docentnaam":"Peter"},{"docentnaam":"Dietske"},{"docentnaam":"Peter"}]



document.getElementById('test').innerHTML= docents.map(o=> {return o.docentnaam;} );

</script>