Basics

Angular.html

<!doctype html>
<html lang="ja" ng-app>
<head>
    <meta charset="UTF-8">
    <title>Untitled Document</title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular.min.js"></script>
</head>
<body>
<div>
    <label>Name:</label>
    <input type="text" ng-model="yourName" placeholder="Enter a name here">
    <hr>
    <h1>Hello {{yourName}}!</h1>
</div>
</body>
</html>

htmlタグにng-app、inputタグにng-model、表示したいものは{{ng-modelのやつ}}
かんたん

youtube動画内にあったおまけ

jquery.html

<!doctype html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <title>Untitled Document</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
</head>
<body>
<div>
    <label>Name:</label>
    <input type="text" id="name" placeholder="Enter a name here">

    <hr>
    <h1 id="greeting">Hello !</h1>
</div>

<script>
$(function(){
    var name = $('#name');
    var greeting = $('#greeting');

    name.keyup(function(){
        greeting.text('Hello ' + name.val() + '!');
    });
})();    
</script>
</body>
</html>

scriptタグ内にいろいろ書く。分かりにくくてたいへん

Angular.js入門サンプルその１

Basics