AngularJS 使用输入值属性

Posted 2023-03-05

【中文标题】AngularJS 使用输入值属性

【英文标题】：AngularJS Use Input Value Attribute

【发布时间】：2013-09-03 19:32:17

【问题描述】：

如何指导 AngularJS 将value 属性同化到模型中？我提供ng-model 属性的任何字段都将其value 立即替换为任何内容，或者我在控制器中定义的任何内容。这是一些代码：

<form action="" method="post" ng-controller="PageCtrl">
    <input type="text" name="title" ng-model="title" value="Initial field value">
</form>

还有 javascript...

function PageCtrl($scope, Slug) 
    $scope.title = null;

我试过不设置$scope.title，将其设置为其他东西，但无论我做什么，value 都会被完全忽略。我能做什么？

【参考方案1】：

是的，angularjs 忽略了 value 属性，转而使用 ng-model。最好完全从您的输入中删除值以避免混淆。

设置默认值的角度方式是在控制器内部设置$scope.title = 'Initial field value'，这是尽可能构建事物的优选方式。如果这不可能，那么您也可以在输入上使用 ng-init 来做同样的事情，例如

 <input type="text" name="title" ng-model="title" ng-init="title = 'Initial field value'">

【讨论】：

在这种情况下，我正在使用 Rails 构建一个表单。您如何建议将这些数据提供给控制器以进行表单填充？

@Jonah 我不确定问题是什么？您可以设置 $scope.title="some default value" 或者您可以在输入上设置占位符属性。你到底想达到什么目的？您应该能够使用 $http 或 $resource 与服务层进行通信。

@shaunhusain 我希望能够在没有任何 Javascript 的情况下动态填充表单。看起来这应该是基本功能:(

@Jonah 它是基本功能，但实现它的方法是使用控制器内部的$http 服务进行http 调用。你的 Angular 应用应该通过 http 调用与你的 ruby​​ 后端交互，而不是让 rails 动态返回不同的视图。

角度超过 ember 的要点之一是 能够将其应用于系统的某些部分，而不是从头开始 single page app - 所以你可以仍然使用来自服务器的表单呈现一个新页面，包括值中的模型数据，并通过 $http 使用 angular 更新模型。现在，您似乎需要呈现哑形式并对默认/现有对象数据提出额外请求。除此之外，您将回退到常规形式 POST 操作。太糟糕了..