AngularJs和ASP.NET MVC 5 - 纳克模型覆盖文本框的值文本框、模型、纳克、ASP

2023-09-13 03:04:14 作者:喂你吃翔

我有使用ASP.NET MVC 5使用 @ Html.TextBoxFor 来填充我的模型(如表格建一个表单,表单导航或服务器端验证后,故障)。

I have a form built using ASP.NET MVC 5 using @Html.TextBoxFor to populate the form with my model (e.g, after a form navigation or server side validation failure).

我现在已经推出了采用了棱角分明一个客户端地址查找,这意味着一些表单域现在都用 NG-模型装饰,使角查找来填充搜索地址。

I have now introduced a client side address lookup using Angular which means some of the form fields are now decorated with ng-model to enable the Angular lookup to populate the searched address.

例如:

@Html.TextBoxFor(m => m.Town, new { @class="form-control", ng_model="address.town" })

添加 NG-模型现在覆盖从当页面重新加载MVC模式的设定值。

Adding the ng-model now overrides the value set from the MVC model when the page is reloaded.

在浏览器中查看源代码显示,文本框的值正确设置为从MVC模型,但角度随后到来,并与 address.town 这是空的,所以窗体显示没有价值了。

Viewing the source in the browser shows that the textbox value is set correctly to Town from the MVC model but Angular then comes along and populates it with address.town which is empty so the form displays no value.

我如何prevent从这样的角?

How can I prevent Angular from doing this?

推荐答案

您可以使用 NG-INIT 从MVC强制值

You can use ng-init to force a value from MVC

<input name="Town" type="text" ng-model="address.town" ng-init="address.town= @Model.Town" />

@Html.TextBoxFor(m => m.Town, new { ng_model="address.town", ng_init="address.town= Model.Town" })

另外,我用一个指令,我发现这里的http://stackoverflow.com/a/22567485/2030565

app.directive('input', function ($parse) {
    return {
        restrict: 'E',
        require: '?ngModel',
        link: function (scope, element, attrs) {
            if (attrs.ngModel) {
                val = attrs.value || element.text();
                $parse(attrs.ngModel).assign(scope, val);
            }
        }
}; });
 
精彩推荐
图片推荐