Wie man Eckiges Objekt zu Mops Mixin übergibt?

Question

Also, ich habe ein verschachteltes Objekt in Angular Richtlinie: +item-baseblock-preview('{{data.page_block_items[0]}}')

Innerhalb von mixin dieses Objekt zeigt nur als Objekt:

mixin item-baseblock-preview(item) 
    ... 
    ... 
    #{item} 

{ 
    "preview_type":"default", 
    "position":0, 
    "material": { 
     "id":1, 
     "name":"Fashion's Night Out", 
     "code":"fashion-s-night-out", 
     "is_adult_content":false, 
     "is_private_content":false, 
     "tags":[{ 
      "id":4, 
      "name":"Vogue", 
      "code":"vogue" 
     },{ 
      "id":1, 
      "name":"Tokio", 
      "code":"tokio" 
     }], 
     "authors": [{ 
      "name":"Bill", 
      "code":"bill" 
     }], 
     "image": { 
      "id":13, 
      "preview_url":"" 
     } 
    } 
} 

ich es Mops mixin übergeben möge

Wenn ich versuche, nur ein Feld von Objekt wie #{item.position} anzuzeigen, zeigt Pug nichts an. Wie man es repariert?

Answer 1

Sie können tatsächliches JavaScript in Pug einschließen, das während des Kompiliervorgangs ausgeführt wird; also absolut alles ist möglich.

Werfen Sie einen Blick auf dieses Arbeitsbeispiel ...

//- This is a pug mixin that produces an Angular Material list with checkboxes... 
mixin list(repeat, title, event) 
    md-list(layout='column', layout-align='start stretch', flex='100', style='overflow: scroll') 
    md-list-item(ng-repeat="item in " + repeat, ng-click="event('debug', '{{item." + event + "}}')") 
     p 
     b= "{{item." + title + "}}" 
     md-checkbox.md-secondary(ng-model='topping.wanted') 

//- This generates two mixin-injected material design lists... 

//- This one uses events.title to display, and sends events.content as an event... 
+list('events', 'title', 'content') 

//- This one uses events.content to display, and sends events.title as an event... 
+list('events', 'content', 'title') 

Wenn Sie hangups über das Verständnis, die sind, wie Sie JavaScript Injektion in pug funktioniert, nur im Kopf behalten etwas hinter dem Gleichheitszeichen ist wie JavaScript behandelt und hat die Einheimischen als Variablen. Schauen Sie sich diesen Artikel an, der eine großartige Arbeit bei der Beschreibung dieses und vieler weiterer ... https://webapplog.com/jade/

leistet