TypeScript

by praveen_kr

HTML

<div id="app"></div>

CSS

body {
  background: #20262E;
  padding: 20px;
  font-family: Helvetica;
}

#app {
  background: #fff;
  border-radius: 4px;
  padding: 20px;
  transition: all 0.2s;
  text-align: center;
}

TypeScript

public class PositionFunction {
    constructor(public code: string, public name: string, public subFunctions: PositionSubFunction[]) {

    }
}

public class PositionSubFunction {
    constructor(id: number, name: string, categories: PositionCategory[]) {}
}

public class PositionCategory {
    constructor(code: string, name: string, positionFamilies: PositionFamily[]) {}
}

public class PositionFamily {
    constructor(
        recordId: string
        , codeShort: string
        , codeLong: string
        , title: string, description: string,
        surveyPositionId: number,
        keyWords: string) {}
}

var json = {"Total":3,"Results":[{"Id":"2f2f64b3-bea7-4a7d-8a8b-791f636d74fa","Name":"Radford Global Technology Survey","Code":"GTS","JobFamilies":[],"ManagerID":null,"ManagerName":null,"ManagerEmail":null,"ManagerContact":null,"DisplayPD":false,"Countries":[{"Id":9,"RecordId":"98462698-8048-465d-b58a-bfe73e9f5dc1","Name":"Argentina","DisplayOrder":0,"CountryZone":"Americas"},{"Id":12,"RecordId":"3db26cf6-4377-434a-ae73-0c7b63c37419","Name":"Australia","DisplayOrder":0,"CountryZone":"Asia / Pacific"},{"Id":13,"RecordId":"a2f66bfe-1c94-466e-a442-2c485cf5c143","Name":"Austria","DisplayOrder":0,"CountryZone":"Europe"},{"Id":16,"RecordId":"63e54a81-b0c5-498e-85b4-4acdb81f5969","Name":"Bahrain","DisplayOrder":0,"CountryZone":"Middle East / Africa"},{"Id":17,"RecordId":"913dc547-3f07-4471-90d7-3f1769afb439","Name":"Bangladesh","DisplayOrder":0,"CountryZone":"Asia /...