HTML, Angular, Json

This is a variation on an earlier page that actually has a purpose. I used to chuck my favourite links into a piece of html.. well I’m still doing that, but at least I’ve separated the data from the code. I wanted to have a separate file for the Json, but in static pages, you can’t easily do that for security reasons, and I don’t want to spin up IIS etc for something so simple.

This is the end result (so you just keeping adding to the Json):

<pre><!DOCTYPE html>
<html ng-app="linksApp">
<title>My name is John</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
	<link rel="stylesheet" href="">
<body ng-controller="linksCtrl as ctrl">
<div class="container" ng-cloak>
<h2>{{ctrl.Summary}} (Count:{{ctrl.Links.length}})</h2>
<table class="table table-condensed">
<tr ng-repeat="links in ctrl.Links">
<td><a href="{{links.URL}}">{{links.Name}}</a></td>
<script src=""></script>
 <script type="application/javascript">
 var linksApp = angular.module("linksApp",[]);
 linksApp.controller("linksCtrl", [function() {
 vm = this;
 vm.Summary = "A Set of Links";
 vm.Links = Links;

<!-- data... -->
 var Links = [
 {"Name" : "My blog", "URL" : ""},
 {"Name" : "Foreigner - Double Vision - YouTube", "URL" : ""},
 {"Name" : "Acer 27\" monitor", "URL" : ""},
 {"Name" : "Chords for Hazard", "URL" : ""},


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s