Verwenden von Lenker-Lookup mit Wiederholung

Question

Angesichts einer Reihe von Objekten möchte ich eine Eigenschaft eines verschachtelten Objekts verwenden, um verschiedene Eigenschaften in einem zugeordneten Objekt in Lenker zu suchen.

In diesem Beispiel möchte ich eine Liste von Studenten an jeder Universität und Informationen über die Abteilung, zu der jeder Student gehört, zeigen.

Mein Code funktioniert, aber die verschachtelten Lookups sind sehr repetitiv:

{{lookup (lookup ../majors major) 'dean'}} 
{{lookup (lookup ../majors major) 'location'}} 

Gibt es etwas, was ich dagegen tun kann? Ich möchte den Kontext der Lookup-Zugang zu tun, so etwas wie dieses:

{{#lookup ../majors major}} 
    {{dean}} 
    {{location}} 
{{/lookup}} 

var source = $("#hb-template").html(); 
 
var template = Handlebars.compile(source); 
 
var html = template(context); 
 
$("#hb-html").html(html);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/4.0.6/handlebars.min.js"></script> 
 

 
<script id="hb-template" type="text/x-handlebars-template"> 
 
    {{#universities}} 
 
    <h1>{{name}}</h1> 
 
    {{#students}} 
 
    <h2>{{name}}</h2> 
 
    <dl> 
 
    <dt>Major</dt> 
 
    <dd>{{major}}</dd> 
 
    <dt>Department dean</dt> 
 
    <dd>{{lookup (lookup ../majors major) 'dean'}}</dd> 
 
    <dt>Department location</dt> 
 
    <dd>{{lookup (lookup ../majors major) 'location'}}</dd> 
 
    </dl> 
 
    {{/students}} 
 
    {{/universities}} 
 
</script> 
 

 
<div id="hb-html"> 
 
</div> 
 

 
<script> 
 
    var context = { 
 
    "universities": [{ 
 
     "name": "Example University", 
 
     "students": [{ 
 
      "name": "Alice", 
 
      "major": "Business" 
 
      }, 
 
      { 
 
      "name": "John", 
 
      "major": "English" 
 
      } 
 
     ], 
 
     "majors": { 
 
      "English": { 
 
      "dean": "Dr. Smith", 
 
      "location": "Room 101" 
 
      }, 
 
      "Business": { 
 
      "dean": "Dr. Jones", 
 
      "location": "Room 999" 
 
      } 
 
     } 
 
     }, 
 
     { 
 
     "name": "Another University", 
 
     "students": [{ 
 
      "name": "Bob", 
 
      "major": "Business" 
 
     }], 
 
     "majors": { 
 
      "Business": { 
 
      "dean": "Dr. Zimmerman", 
 
      "location": "South Campus" 
 
      } 
 
     } 
 
     } 
 
    ] 
 
    }; 
 
</script>

Answer 1

Hier ist meine Lösung: die {{#with}} helper nutzen und das Ergebnis der Suche subexpression passieren -ein Objekt. Ich bin mir nicht sicher, ob dies die beste Methode ist, oder warum dies wirklich funktioniert, deshalb würde ich mich über Kommentare freuen.

{{#with (lookup ../majors major)}} 
    <dt>Department dean</dt> 
    <dd>{{dean}}</dd> 
    <dt>Department location</dt> 
    <dd>{{location}}</dd> 
{{/with}} 

Voll Beispiel:

var source = $("#hb-template").html(); 
 
var template = Handlebars.compile(source); 
 
var html = template(context); 
 
$("#hb-html").html(html);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/4.0.6/handlebars.min.js"></script> 
 

 
<script id="hb-template" type="text/x-handlebars-template"> 
 
    {{#universities}} 
 
    <h1>{{name}}</h1> 
 
    {{#students}} 
 
    <h2>{{name}}</h2> 
 
    <dl> 
 
    <dt>Major</dt> 
 
    <dd>{{major}}</dd> 
 
    {{#with (lookup ../majors major)}} 
 
    <dt>Department dean</dt> 
 
    <dd>{{dean}}</dd> 
 
    <dt>Department location</dt> 
 
    <dd>{{location}}</dd> 
 
    {{/with}} 
 
    </dl> 
 
    {{/students}} 
 
    {{/universities}} 
 
</script> 
 

 
<div id="hb-html"> 
 
</div> 
 

 
<script> 
 
    var context = { 
 
    "universities": [{ 
 
     "name": "Example University", 
 
     "students": [{ 
 
      "name": "Alice", 
 
      "major": "Business" 
 
      }, 
 
      { 
 
      "name": "John", 
 
      "major": "English" 
 
      } 
 
     ], 
 
     "majors": { 
 
      "English": { 
 
      "dean": "Dr. Smith", 
 
      "location": "Room 101" 
 
      }, 
 
      "Business": { 
 
      "dean": "Dr. Jones", 
 
      "location": "Room 999" 
 
      } 
 
     } 
 
     }, 
 
     { 
 
     "name": "Another University", 
 
     "students": [{ 
 
      "name": "Bob", 
 
      "major": "Business" 
 
     }], 
 
     "majors": { 
 
      "Business": { 
 
      "dean": "Dr. Zimmerman", 
 
      "location": "South Campus" 
 
      } 
 
     } 
 
     } 
 
    ] 
 
    }; 
 
</script>