Angular1 Example

Angular exmaple to print a json based UI

by VENKATA VINAY BYSANI

HTML

<div ng-app>
  <h2>Todo</h2>
  <div ng-controller="TodoCtrl">
    <span>Priv Pol</span>
      <div ng-repeat="currentHeading in pripol.tyo">
        <strong>{{currentHeading.title}}</strong>
        <br/>
        <!-- <td ng-if="x.Country!== ''"> -->
        <p ng-if="currentHeading.description!= ''">
        {{currentHeading.description}}
        </p>
        
        <div ng-if="currentHeading.descriptionParagraphs!= ''">

              <p ng-repeat="currentItem in currentHeading.descriptionParagraphs">{{currentItem}}</p><br/>
            
        </div>
        
        <div ng-if="currentHeading.descriptionLists!= ''">
            <ul>
            
              <li ng-repeat="currentItem in currentHeading.descriptionLists">{{currentItem}}</li>
            </ul>
        </div>
        <br/>
      </div>
    
  </div>
</div>

JavaScript

function TodoCtrl($scope) {
  $scope.pripol = {
  "tyo": [
    {
      "title": "hello",
      "description": "full description with hiperlink details",
      "descriptionParagraphs": "",
      "descriptionLists": ""
    },
    {
      "title": "hello",
      "description": "",
      "descriptionParagraphs": [
        "descrption para1 with <a href='test.com'>link</a>",
        "description para2"
      ],
      "descriptionLists":""
    },
    {
      "title": "hello",
      "description": "",
      "descriptionParagraphs": "",
      "descriptionLists": [
        "full description 1",
        "full description2",
        "full descripton3"
      ]
    }
  ]};

}