HTML 在 ASP.NET MVC 中使用 angular data-ng-model 控制无法正常工作

HTML control not working proper by using angular data-ng-model in ASP.NET MVC

我在 Visual Studio 2015 社区版本中使用 Angular js 1.4.3 和 ASP.NET MVC 4.0 with framework 4.0。

我在视图中使用过这样的文本控件:

<input id="txtItemId" name="txtItemId" type="text" data-ng-model="ItemEdit.ItemId" value="ItemEdit.ItemId" value="ItemEdit.ItemId" disabled />

我想在控制器端获取由 data-ng-model 设置的 txtItemId 值我的意思是后端端(服务器端)但我得到 0 值作为输出。

我获取记录的代码是:

FormCollection frm; (defined in function() defination)
string id = Convert.ToInt32(frm["txtItemId"]); // here I get 0 instead of already set value "1"

第二个问题是下拉列表我用它来绑定状态记录使用 Angular js 并且做得很好但是在编辑时 angular 没有将值设置为 id下拉列表:

<select id="ddlState" name="ddlState" data-ng-options="s.Text for s in stateoptions" data-ng-model="stateselectedOption"></select>

如有任何帮助,我们将不胜感激。

这是预期的结果,因为 angular 会自动将表单输入与当前范围同步 - over-writing 您在服务器端设置的任何值。

您需要在页面加载时初始化 angular 范围。这可以通过将您的 MVC 模型转换为视图中的 Json 并在那里设置范围来实现。

Angular

myApp.controller('myController', ['$scope', 'viewModel',
   function ($scope,  viewModel) {
        $scope.viewModel = viewModel;
   }]
);

查看

<div ng-controller="myController"> ....  </div>
<script type="text/javascript">
 var model = @Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(this.Model));
 myApp.value("viewModel", model);
</script>