Skip to content

Instantly share code, notes, and snippets.

@flipjs

flipjs/index.html

Last active August 29, 2015 14:06
Show Gist options
  • Save flipjs/93419df0b65f0b3ab968 to your computer and use it in GitHub Desktop.
Save flipjs/93419df0b65f0b3ab968 to your computer and use it in GitHub Desktop.
Download ZIP
Angular: bindToController
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Angular App</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" />
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-rc.0/angular.min.js"></script>
<script src="app.js"></script>
<style>
.btn-xlarge {
padding: 18px 28px;
font-size: 22px;
line-height: normal;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
}
.red {
color: #f00;
}
.black {
color: #000;
}
</style>
</head>
<body ng-app="app">
<header>
<nav class="navbar navbar-default">
<div class="container">
<div class="navbar-header">
<a class="navbar-brand" href="http://flipjs.io">flipjs.io</a>
</div>
<ul class="nav navbar-nav navbar-right">
<li><a href="#"><i class="fa fa-home"></i> Home</a></li>
<li><a href="#about"><i class="fa fa-info-circle"></i> About</a></li>
<li><a href="#contact"><i class="fa fa-comment"></i> Contact</a></li>
</ul>
</div>
</nav>
</header>
<div class="container jumbotron text-center">
<div ng-controller="ParentController as ParentCtrl">
<h1><i class="fa fa-male"></i><i class="fa fa-female"></i> The <span class="red">{{ ::ParentCtrl.fizzbuzz }}</span> parent.</h1>
<music-player track="ParentCtrl.song" artist="{{ ::ParentCtrl.artist }}"></music-player>
<div ng-controller="ChildController as ChildCtrl">
<h1>The <span class="red">{{ ::ChildCtrl.fizzbuzz }}</span> child. <i class="fa fa-child"></i></h1>
<music-player track="ChildCtrl.song" artist="{{ ::ChildCtrl.artist }}"></music-player>
</div> <!-- ChildController -->
</div> <!-- ParentController -->
</div>
<footer>
<div class="text-center"><h6>© 2014 Felipe Apostol</h6></div>
</footer>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment