Angular Tests

HTML

<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<body ng-app="notesApp">
    <div ng-controller="MainCtrl as mainCtrl">Hello {{1 + 1}}nd time AngularJS
        <p>{{ mainCtrl.model.value }}</p>
        <input type="text" ng-model="mainCtrl.model.value" placeholder="Issue ID">
        <div ng-controller="DetailController as detailCtrl">
            <p>{{ detailCtrl.model.value}}</p>
            <table class="table table-striped" data-sort-name="id" data-sort-order="desc">
                <thead>
                    <tr role="row">
                        <th class="hasinput" style="width:17%" rowspan="1" colspan="1">
                            <input type="text" class="form-control" placeholder="Filter Name">
                        </th>
                        <th class="hasinput" style="width:18%" rowspan="1" colspan="1">
                            <div class="input-group">
                                <input class="form-control" placeholder="Filter Position" type="text">	<span class="input-group-addon">
												<span class="onoffswitch">
													<input type="checkbox" name="start_interval" class="onoffswitch-checkbox" id="st3">
													<label class="onoffswitch-label" for="st3"> 
														<span class="onoffswitch-inner" data-swchon-text="YES" data-swchoff-text="NO"></span> 	<span class="onoffswitch-switch"></span> 
                                </label>
                                </span>
                                </span>
                            </div>
                        </th>
                        <th class="hasinput" style="width:16%" rowspan="1" colspan="1">
                            <input type="text" class="form-control" placeholder="Filter Office">
                            <th class="hasinput icon-addon" rowspan="1" colspan="1">
                                <input...

JavaScript

angular.module('notesApp', ['notesApp.factories', 'notesApp.controllers']);

angular.module('notesApp.factories', []).
factory('sharedModel', function () {
    var sharedModel = {
        value: "Initial Value",
        issues: [{
            id: 1,
            title: 'here is the first thing'
        }, {
            id: 2,
            title: 'here is the second thing'
        }, {
            id: 3,
            title: 'here is the third thing'
        }]
    };
    sharedModel.updateValue = function (value) {
        sharedModel.value = value;
    };
    return sharedModel;
});

angular.module('notesApp.controllers', ['notesApp.factories']).
controller('MainCtrl', ['$scope', 'sharedModel', function ($scope, sharedModel) {
    var self = this;

    self.model = sharedModel;
    //$scope.model = sharedModel;
    //$scope.updateValue = sharedModel.updateValue;

    // Controller specific code goes here
    console.log('MainCtrl has been created');
}]).
controller('DetailController', ['$scope', 'sharedModel', function ($scope, sharedModel) {
    var self = this;

    self.model = sharedModel;
    //$scope.model = sharedModel;
    //$scope.updateValue = sharedModel.updateValue;

    //self.duh = self.Issue.id;
}]);