angularjs使用ng-messages-include实例

<!DOCTYPE html>
<html lang="zh-CN" ng-app="app">
<head>
    <meta charset="utf-8">
    <title>注册</title>
    <link rel="stylesheet" href="../bootstrap.min.css">
</head>
<body>
    <form name="signup_form" novalidate ng-submit="signupForm()" ng-controller="signupController">
        <fieldset>
            <legend>Signup</legend>
            <div class="row">
                <div class="col-xs-12">
                    <label>Your name</label>
                    <input type="email"
                        placeholder="Name"
                        name="name"
                        ng-model="signup.name"
                        ng-minlength="3"
                        ng-maxlength="20"
                        required>
                    <div class="error" ng-messages="signup_form.name.$error" ng-messages-multiple>
                        <small ng-message="minlength">覆盖模板中的提示不能小于3位</small><!--这样可以覆盖模板中的提示-->
                        <div ng-messages-include="templates/errors.html"></div>
                        <!--或者这样写
                            <ng-messages-include src="templates/errors.html"></ng-messages-include>
                        -->
                    </div>
                </div>
            </div>
            <button type="submit" class="btn btn-default">Submit</button>
        </fieldset>
    </form>
    <script src="../angular.min.js"></script>
    <script src="angular-messages.min.js"></script>
    <script>
        angular.module('app', ['ngMessages'])
        .controller('signupController', function($scope) {

        })
    </script>
</body>
</html>

templates中的代码

<small ng-message="required">必填</small>
<small ng-message="email">邮箱不正确</small>
<small ng-message="minlength">不能小于3位</small>
<small ng-message="maxlength">不能大于20位</small>

以上展示的是实例代码

用法

1.<div ng-messages-include="templates/errors.html"></div>
2.<ng-messages-include src="templates/errors.html"></ng-messages-include>