JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.8/angular.min.js"></script>
<div class="container" ng-app="app" ng-controller="MainCtrl">
    <header>
        <div class="page-header">
             <h2>バインディングに連動したフォームの検証<small>（フォーム全体）</small></h2>

        </div>
    </header>
    <section>
        <form name="form" class="form-horizontal">
            <!-- 名前 -->
            <div class="form-group" ng-class="{'has-error':!form.name.$valid}">
                <label for="tiName" class="col-sm-2 control-label">名前</label>
                <div class="col-sm-10">
                    <input id="tiName" type="text" class="form-control" placeholder="名前を入力してください" ng-model="name" name="name" required />
                </div>
            </div>
            <!-- パスワード -->
            <div class="form-group" ng-class="{'has-error':!form.pw.$valid}">
                <label for="tiPw" class="col-sm-2 control-label">パスワード</label>
                <div class="col-sm-10">
                    <input id="tiPw" type="text" class="form-control" placeholder="5文字以上10文字以下" ng-model="pw" name="pw" ng-pattern="/^.{5,10}$/" required />
                </div>
            </div>
            <!-- 日付 -->
            <div class="form-group" ng-class="{'has-error':!form.date.$valid}">
                <label for="diDate" class="col-sm-2 control-label">日付</label>
                <div class="col-sm-10">
                    <input id="diDate" type="date" class="form-control" placeholder="yyyy-MM-dd（今日から１年後まで）" ng-model="date" name="date" required min="{{minDate | date:'yyyy-MM-dd'}}" max="{{maxDate | date:'yyyy-MM-dd'}}" />
                </div>
            </div>
            <!-- 送信ボタン -->
         ...

JavaScript

// appというAngularJSアプリケーションモジュールを作成
var app = angular.module('app', []);

// アプリケーションモジュールにMainCtrlというコントローラーを追加
app.controller('MainCtrl', function ($scope) {

    //初期選択の日付を今日の日付に設定
    $scope.date = new Date();

    //期間の最小を今日の日付に設定
    $scope.minDate = new Date();

    //期間の最大を今日の日付から１年後に設定
    var maxDate = new Date();
    maxDate.setFullYear(maxDate.getFullYear() + 1);
    $scope.maxDate = maxDate;

});