使用angular js的验证问题(firefox上显示红色边框)

我做了一个简单的form from object ..现在我验证的形式。我面临一些问题，而验证。

http://plnkr.co/edit/CFUR2mgVv4hzXPF7AR9y?p =

• 当我写所需的true和显示消息"请输入有效的电子邮件"后，我的字段变成红色(输入字段上的红色边框)。当用户将焦点移到另一个字段时，它应该变成红色。我需要显示两个消息"请输入电子邮件"与"请输入有效的电子邮件"我怎么能做到这一点?

我学习了很多教程，但我应用了这个东西$dirty， $pristine，但对我来说没有任何作用。我从那里学习验证…http://scotch.io/tutorials/javascript/angularjs-form-validation

<ul ng-repeat="input in inputs">
        <li><span>{{input.name}} : </span>
            <div ng-switch="input.type" ng-form="myfrm">
                <div ng-switch-when="text">
                    <input type="text" ng-model="outputs[input.name]"/>
                </div>
                <div ng-switch-when="email" class="form-group" >
                    <input type="email" ng-model="outputs[input.name]" name="input" ng-required="input.required">
                    <P ng-show="myfrm.input.$invalid  && !myform.input.$pristine">Please enter a valid email</P>

                </div>
                <div ng-switch-when="number">
                    <input type="number" ng-model="outputs[input.name]"  ng-required="input.required" name="input"/>
                     <P ng-if="myfrm.input.$invalid">Please enter a valid number</P>
                </div>
                <div ng-switch-when="url">
                    <input type="number" ng-model="outputs[input.name]"/>
                </div>
                <div ng-switch-when="checkbox">
                    <input type="checkbox" ng-model="outputs[input.name]" ng-checked="outputs[input.name]" value="outputs[input.name]"/>
                </div>
            </div>
        </li>
    </ul>