angularjs - 使用 ng-model angularjs 时未显示表单值

Question

我有一个用于编辑产品的表格，该值显示在检查器中，但不在表格中。当我从代码中删除 ng-model 时，它们会显示出来。

在这一行中，值显示在检查元素中，但不显示在表单中:

<input type="text" class="form-control" placeholder="Product naam" 
value="{{product.title}}" ng-model="formData.title"/>

在这一行中，值显示在检查元素中，格式为:

<input type="text" class="form-control" placeholder="Product naam" 
value="{{product.title}}"/>

但是我需要 ng-model 来传递数据。

有什么建议么？

Answer 1

您不需要输入标签中的 value 属性。 ng-model 已经为您完成了绑定(bind)。如果您在 Controller 中定义 formData.title，它将反射(reflect)您输入的值。

同样，如果用户更改输入的值，它会反射(reflect)在 Controller 中声明的值。

这就是著名的 AngularJS 的双向数据绑定(bind)。一个真棒和危险 框架的特点

看看这个 fiddle :

http://jsfiddle.net/relferreira/kLcqwuqf/

HTML:

<div ng-app="app">

  <div ng-controller="MainController">
    <input type="text" data-ng-model="test">
  </div>

</div>

JS:

angular.module('app', []);

angular.module('app')
    .controller('MainController', mainController)

mainController.$inject = ['$scope'];
function mainController($scope){

  $scope.test = 'value of the input'

}