<label>Name:</label>
<input type="text" ng-model="yourName" placeholder="Enter a name">
<hr>
<h1>Hello {{ yourName } } !</h1>
Hello {{yourName}}!
function MyCtrl($scope) { $scope.yourName2 = '<Please type a name>'; $scope.resetName = function () { $scope.yourName2 = '<Please type a name>'; } }
// Input and Button HTML: <input ng-model="yourName2" placeholder="Enter a name">
<button ng-click="resetName()">Reset</button>
My Name is {{yourName2}}
Directives are a way to teach HTML new tricks
Ways to invoke a directive
// Attribute
<span my-dir="exp"></span>
// Class
<span class="my-dir: exp;"></span>
// Element
<my-dir></my-dir>
// Comment
<!-- directive: my-dir exp -->
// Mustache filters
{{salary | number:2} }
// Data filtering
<tr ng-repeat="emp in employees | filter:'sarah'">
<td>{{emp.name}}</td> </tr>
// PIPING!!! #FTW
<tr ng-repeat="emp in employees | dept:'Engineering' | skill:'Rails'">
<td>{{emp.name | allCaps } }</td>
</tr>