AngularJS编辑表单更新JSON文件时添加ng-model后字段值不显示问题

• ng-model优先级覆盖原生value属性：AngularJS中ng-model会绑定作用域上的变量，渲染时会优先使用ng-model对应变量的值覆盖原生value属性的内容，你之前用{{}}写在value里的内容会被直接忽略。只有ProjectID字段正常显示，是因为你大概率在作用域里刚好给UProjectID赋了初始值，其他UName、UStartDate这类绑定变量你没有做初始化赋值，默认是空值，导致字段无内容显示。
• 作用域变量初始化逻辑缺失：你预期点击项目时自动填充值，但没有把projectDetails里的属性值同步赋值给ng-model绑定的U开头变量，所以点击项目时只有projectDetails更新，ng-model绑定的变量没有同步更新，自然无法回填到输入框。
• 语法小问题：Owner字段的ng-model属性前面没有加空格，和前面的value属性直接拼接，可能导致该字段的指令解析异常。
• 日期类型适配问题：type="date"的输入框要求ng-model绑定的值必须是标准Date对象，如果你存在projectDetails.StartDate是字符串格式的情况，就算赋值了也无法正常渲染到日期输入框。
• 下拉框匹配问题：下拉框的ng-model值需要和option的value属性值类型完全匹配，比如你的option值是字符串格式的"2"，如果UStatus是数字类型的2，就会匹配不到对应选项，导致下拉框默认无选中值。

1. 删掉所有输入框上的value属性，ng-model作为唯一的值绑定入口，不需要同时写value属性。
2. 在点击项目触发的回调函数中，把projectDetails的属性值同步赋值给ng-model对应的变量，参考代码：

// 点击项目的回调函数示例
$scope.selectProject = function(project) {
  $scope.projectDetails = project;
  // 同步给ng-model绑定的变量赋值
  $scope.UProjectID = project.ProjectID;
  $scope.UName = project.Name;
  $scope.UStartDate = new Date(project.StartDate); // 日期类型要转成Date对象才能正常渲染
  $scope.UEndDate = new Date(project.EndDate);
  $scope.UStatus = String(project.Status); // 统一转成字符串和option的value类型匹配
  $scope.UContactPerson = project.ContactPerson;
  $scope.UContractor = project.Contractor;
  $scope.UProjectManager = project.ProjectManager;
}

3. 修复Owner输入框的属性空格问题，保证每个属性之间有空格分隔。

内容的提问来源于stack exchange，提问作者Andiie