telamon/github-directive.html

## github-directive.html
<!DOCTYPE html>
<html ng-app="app">

  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-rc.3/angular.min.js"></script>
    <script type="text/javascript">
      var app = angular.module('app',['ng']);
      app.controller('MainCtrl', function($scope){

      });


      app.directive('github',function($http){
          return {
              restrict: 'E',
              scope : { user: '@' },
              controller : function($scope){
                  $http.get('https://api.github.com/users/' + $scope.user)
                  .then(function(res){
                    $scope.profile = res.data;
                  })
                  .catch(function(err){
                    console.log("Error",err);
                  });
              },
              template : '<div class="github-badge">'+
                '<img src="{{profile.avatar_url}}" width="64"/>'+
                '<p>{{profile.name}}</p>'+
              '</div>'
          }
      });

    </script>
  </head>

 <body ng-app="app">
    <div ng-controller="MainCtrl">
        <h1>github profile directive</h1>
        <github user="telamon"></github>
        <github user="istenes"></github>
        <github user="kriskowal"></github>

    </div>
  </body>

</html>

## value.html
<html ng-app="myApp">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-rc.3/angular.min.js"></script>
<script type="text/javascript">
	console.log("hello")
	var app = angular.module("myApp", []);
	app.value("user", {
		name: "username",
		country: "country",
		phone: "phone"
	});

	app.controller("TestCtrl", function(user, $scope, $http) {
		console.log(user);
		$scope.user = user;

		$scope.login = function() {
			console.log($scope.username);
			console.log($scope.password);
			var data = {
				username: $scope.username,
				password: $scope.password
			}

			$http.post("login", data).success(function(response) {
				$scope.user.name = response.name;
				$scope.user.country = response.country;
				$scope.user.phone = response.phone;
				console.log(response);
			});
		}
	});

</script>
</head>
<body>
<div ng-controller="TestCtrl">
	Name: {{user.name}} <br />
	Country: {{user.country}}<br />
	Phone: {{user.phone}}<br />

  		<input ng-model="username" />
  		<input ng-model="password" type="password"/>
  		<button ng-click="login()">Login</button>

</div>
</body>
</html>
	<!DOCTYPE html>
	<html ng-app="app">

	<head>
	<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-rc.3/angular.min.js"></script>
	<script type="text/javascript">
	var app = angular.module('app',['ng']);
	app.controller('MainCtrl', function($scope){

	});


	app.directive('github',function($http){
	return {
	restrict: 'E',
	scope : { user: '@' },
	controller : function($scope){
	$http.get('https://api.github.com/users/' + $scope.user)
	.then(function(res){
	$scope.profile = res.data;
	})
	.catch(function(err){
	console.log("Error",err);
	});
	},
	template : '<div class="github-badge">'+
	'<img src="{{profile.avatar_url}}" width="64"/>'+
	'<p>{{profile.name}}</p>'+
	'</div>'
	}
	});

	</script>
	</head>

	<body ng-app="app">
	<div ng-controller="MainCtrl">
	<h1>github profile directive</h1>
	<github user="telamon"></github>
	<github user="istenes"></github>
	<github user="kriskowal"></github>

	</div>
	</body>

	</html>
	<html ng-app="myApp">
	<head>
	<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-rc.3/angular.min.js"></script>
	<script type="text/javascript">
	console.log("hello")
	var app = angular.module("myApp", []);
	app.value("user", {
	name: "username",
	country: "country",
	phone: "phone"
	});

	app.controller("TestCtrl", function(user, $scope, $http) {
	console.log(user);
	$scope.user = user;

	$scope.login = function() {
	console.log($scope.username);
	console.log($scope.password);
	var data = {
	username: $scope.username,
	password: $scope.password
	}

	$http.post("login", data).success(function(response) {
	$scope.user.name = response.name;
	$scope.user.country = response.country;
	$scope.user.phone = response.phone;
	console.log(response);
	});
	}
	});

	</script>
	</head>
	<body>
	<div ng-controller="TestCtrl">
	Name: {{user.name}} <br />
	Country: {{user.country}}<br />
	Phone: {{user.phone}}<br />

	<input ng-model="username" />
	<input ng-model="password" type="password"/>
	<button ng-click="login()">Login</button>

	</div>
	</body>
	</html>