<span *ngIf="isTrivial" class="param-type param-type-trivial" [ngClass]="type">{{_displayType}}</span>
<div *ngIf="!isTrivial" class="params-wrap" [ngClass]="{'params-array': isArray}">
  <div *ngFor="#prop of data.properties" class="param-wrap">
    <div class="param" [ngClass]="{'discriminator': prop.isDiscriminator}">
      <div class="param-name">
        <span>{{prop._name}}</span>
      </div>
      <div class="param-info">
        <div>
          <span class="param-type" [ngClass]="prop.type">{{prop._displayType}} {{prop._displayFormat}}</span>
          <span *ngIf="prop.isRequired" class="param-required">Required</span>
        </div>
        <div class="param-description" innerHtml="{{prop.description | marked}}"></div>
        <div class="discriminator-info" *ngIf="prop.isDiscriminator"> This field value determines the exact schema: </div>
      </div>
    </div>
    <div class="param-schema" [ngClass]="{'param-array': prop._isArray}" *ngIf="prop._pointer">
      <json-schema pointer="{{prop._pointer}}" [isArray]='prop._isArray'>
      </json-schema>
    </div>
  </div>
  <div *ngIf="data.derived.length" class="param-wrap">
    <tabs>
      <tab *ngFor="#derived of data.derived" tabTitle="{{derived.name}}">
        <json-schema pointer="{{derived.$ref}}" [final]="derived.final">
        </json-schema>
      </tab>
    </tabs>
  </div>
</div>