Skip to content

Instantly share code, notes, and snippets.

@chantastic

chantastic/index.html

Last active August 29, 2015 14:01
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save chantastic/46f03bc1dddbb1662f15 to your computer and use it in GitHub Desktop.
Save chantastic/46f03bc1dddbb1662f15 to your computer and use it in GitHub Desktop.
Download ZIP
Full Stack: Angular 101 Workshop (concepts)
Raw
index.html
<!doctype html>
<!-- exercise 1 -->
<!-- bootstraping an angular app -->
<html ng-app>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.8/angular.min.js"></script>
</head>
<body>
<!-- exercise 2 -->
<!-- directive/binding basics -->
<label>
Name: <input type="text" ng-model="name" placeholder="Enter a name here">
</label>
<h1 ng-show="name">Ohai {{ name }}!</h1>
<!-- exercise 3 -->
<!-- more on directives -->
<span ng-init="people = [{name: 'Scott'},{name: 'Kevin'},{name: 'Micahel'}]"></span>
<h3> List of names </h1>
<ul>
<li ng-repeat="person in people">
{{ person.name }}
</li>
</ul>
</body>
</html>
@chantastic
Copy link
Author

Yup, ng-init is a bad road to go down. But I think it's helpful when trying to teach directive-basics without having to first cover controllers.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment