Angular ASP.NET MVC Binding

Question

在我们的MVC 5项目中,我们使用Angular.以下Razor工作得很好:

 @Html.EditorFor(x => x.FirstName,
          new { required = "required", ng_model = "FirstName" })

但是,如果在呈现页面时将MVC Model.FirstName设置为"Bob",则"输入"字段仍为空.

如果我在Angular控制器中设置它:

  $scope.FirstName = "@(Model.FirstName)";

然后出现"Bob".

我的问题是:我是否必须为UI中的每个字段设置$ scope.VARIABLE = MODEL.VARIABLE,或者我可以告诉Angular尊重ASP.NET MVC提供的内容.

Angular似乎过度写入了MVC写的[input value ="Bob"].

Answer 1

绑定到范围时,无需将模型分成单个字段.相反,你应该绑定整个模型:

 $scope.model = @Html.Raw(Json.Encode(Model));

这将呈现给客户:

 $scope.model = { FirstName: 'John', LastName:'Doe', etc };

然后,您可以将输入字段绑定为:

@Html.EditorFor(x => x.FirstName,
      new { required = "required", ng_model = "model.FirstName" })

就个人而言,我认为它更干净,不使用@Html,支持简单的HTML:

<input ng-model="model.FirstName" required />

在Angular中,你不再需要id了.