使用AngularJS的ASP.NET MVCvalidation表单
我在MVC 4和AngularJS（+ twitter引导）项目。 我通常在我的MVC项目中使用“jQuery.Validate”，“DataAnnotations”和“Razor”。 然后我在我的web.config中启用这些键来validation客户机上模型的属性：
<add key="ClientValidationEnabled" value="true" /> <add key="UnobtrusiveJavaScriptEnabled" value="true" /> 例如，如果我在我的模型中有这个：
[Required] [Display(Name = "Your name")] public string Name { get; set; }
有了这个Cshtml：
@Html.LabelFor(model => model.Name) @Html.TextBoxFor(model => model.Name) @Html.ValidationMessageFor(model => model.Name)
html结果会：
<label for="Name">Your name</label> <input data-val="true" data-val-required="The field Your name is required." id="Name" name="Name" type="text" value="" /> <span class="field-validation-valid" data-valmsg-for="Name" data-valmsg-replace="true"></span>
但是现在当我使用AngularJS的时候，我想渲染也许是这样的：
<label for="Name">Your name</label> <input type="text" ng-model="Name" id="Name" name="Name" required /> <div ng-show="form.Name.$invalid"> <span ng-show="form.Name.$error.required">The field Your name is required</span> </div>
我不知道是否有任何帮手或“数据注解”来解决这个问题。 我知道AngularJS有更多的function，比如：
<div ng-show="form.uEmail.$dirty && form.uEmail.$invalid">Invalid: <span ng-show="form.uEmail.$error.required">Tell us your email.</span> <span ng-show="form.uEmail.$error.email">This is not a valid email.</span> </div>
那么具体呢。 我需要一些帮助或“数据注释”来parsing用于在客户端上使用AngularJS显示的属性（数据注解）。
如果它仍然不存在，也许是时候做，就像RazorForAngularJS一样
编辑
我想也许使用ASP.NET MVC和AngularJS最好的方法是手工完成（ front-end ）（手工编写所有的HTML）
作为一个创作了ASP.Net/Angular网站的人，我可以告诉你，你将会脱离使用Razor来渲染你的HTML。
在我的项目中，我已经设置了一个razor视图来渲染我的主页面（我使用的是Angular写的一个页面应用程序），然后我有一个直接的.html文件的文件夹，我用作Angular的模板。
其余完成在ASP.Net Web API调用在我的情况，但你也可以使用MVC行动与JSON结果。
只要我切换到这个架构，对我来说，事情发展更为顺利。
我赞同关于退出剃刀的一些想法，但是您可以创build一些工具来更快地创build页面。 恕我直言，最好是使用razor的function，而不是从工具箱中删除它们。
顺便说一句，看ngval 。 它将数据注释带到客户端作为angularjsvalidation器。 它有一个html助手和一个angular度模块。 我不得不提到这个项目正处于早期的发展阶段。
我写了一个指令，以平滑从MVC到AngularJs的过渡。 标记看起来像：
<validated-input name="username" display="User Name" ng-model="model.username" required>
其行为与Razor惯例相同，包括延迟validation，直到字段被修改。 随着时间的推移，我发现保持我的标记非常直观和简单。
我关于这个问题的文章
Plinkr
我想可能有六种方法可以做你想做的事情。 可能最简单的是使用一个能够识别jquery.validation标记的Angular指令。
这是一个这样的项目： https ： //github.com/mdekrey/unobtrusive-angular-validation
还有另一个： https ： //github.com/danicomas/angular-jquery-validate
我还没有尝试过，因为个人，我通过编写代码来使MVC输出angular度validation属性而不是jquery.validation.unobtrusive属性来解决此问题。
第三个select是仅依靠服务器端validation。 虽然这显然较慢，但对于更复杂的validation场景，这可能是您唯一的select。 在这种情况下，您只需编写javascript来parsingWeb API控制器通常返回的ModelStateDictionary对象。 在那里有一些例子，如何做到这一点，并将其集成到AngularJS的本地validation模型。
下面是parsingModelStateDictionary的一些不完整的代码：
““
angular.module('app') .directive('joshServerValidate', ['$http', function ($http) { return { require: 'ngModel', link: function (scope, ele, attrs, c) { console.info('wiring up ' + attrs.ngModel + ' to controller ' + c.$name); scope.$watch('modelState', function () { if (scope.modelState == null) return; var modelStateKey = attrs.joshServerValidate || attrs.ngModel; modelStateKey = modelStateKey.replace(attrs.joshServerValidatePrefix, ''); modelStateKey = modelStateKey.replace('$index', scope.$index); modelStateKey = modelStateKey.replace('model.', ''); console.info('validation for ' + modelStateKey); if (scope.modelState[modelStateKey]) { c.$setValidity('server', false); c.$error.server = scope.modelState[modelStateKey]; } else { c.$setValidity('server', true); } }); } }; }]);
““
我对这里提供的其他答案感到相当失望。 当你试图validation一些比电子邮件地址更难的东西时，“不要这么做”并不是一个很好的build议。
我认为这是一个问题，angular度的初学者会把（这是我怎么find的:)），这就是为什么我认为这是值得一个答案，也许解释了作者编辑，希望帮助那些问自己同样的问题，我种改写它：如何保持angular度validation和mvc模型validation之间的一致性？
要validation的模型字段从angular度视图 – >angular度控制器 – >angular度服务 – >到asp.webapi方法或者asp.mvc控制器动作，最终映射到一个mvc模型
这意味着，在所有这些（至less4台“投影仪”）上，您必须确保将您要使用razor的确切型号和字段进行转换。
所以我的意思是，有很多事情可能会影响你的一致性。
所以我同意：为客户端手动重写它们，并使用自动化testing来确保一致性
