角度设置表单数据为所有字段

问题描述：

我仍然是新的角度，我不知道如何使表单，当我想更新用户填写表单与他自己的数据。我有控制器这样的：角度设置表单数据为所有字段

 // take data for organization from database    
     dataService.allOrganization().then(function (data) { 
      vm.allOrg = data; 
     }); 
     // take data for user from database 
     dataService.getOneUser(theId).then(function(data) { 
      vm.oneUserUpdate = data; 

     }); 

     $scope.user = {}; 
     $scope.submitForm = function(theId) { 
      $scope.user.idUser = theId; 
      dataService.updateUserPost($scope.user).then(function (data) { 
       vm.oneUserInfo = data;//response from http request 
      }) 
     }

，并考虑：

<form name="userForm" ng-submit="submitForm(userDataCtr.oneUserUpdate.identities[0].user_id)"> 
      <div class="form-group"> 
       <label>Encryption Key :</label> 
       <input type="text" class="form-control" name="encryption" ng-model="user.encryption" > 
      </div> 
      <div class="form-group"> 
       <label>Admin :</label> 
       <select class="form-control" name="admin" ng-model="user.admin"> 
        <option>Select...</option> 
        <option value="true">True</option> 
        <option value="false">False</option> 
       </select> 
      </div> 
      <div class="form-group"> 
       <label>Organization ID:</label> 
       <select class="form-control" name="organization" ng-model="user.organization"> 
        <option>Select...</option> 
        <option ng-repeat="org in userDataCtr.allOrg" value="{{org.id_org}}"> 
         {{org.name_org}} 
        </option> 
       </select> 
      </div> 
      <div class="form-group"> 
       <label></label> 
       <div class="checkbox"> 
        <label><input type="checkbox" value="1" name="role_cro" ng-model="user.role_cro">ROLE_CRO</label> 
       </div> 
       <div class="checkbox"> 
        <label><input type="checkbox" value="1" name="role_client" ng-model="user.role_client">ROLE_CLIENT</label> 
       </div> 
      </div> 
      <button type="submit" class="btn btn-primary">Submit</button> 
     </form>

又如何，如果有可能，以填补用户数据，输入字段中的所有数据具有价值，复选框，如果被检查他们需要，选择组织选择等。

谢谢。

您希望用户在提交前填写所有字段？你想验证正确吗？ –

不，我希望字段在您想要更新用户时自动填充，然后在需要时更改数据。 – Sasa

答

您必须更新模型。例如

dataService.getOneUser(theId).then(function(data) { 
     vm.user={}; 
     vm.user.encryption = data.encryption; 
     vm.user.role_client = data.role; 
    });

上查看

<div ng-controller="Mycontroller as my"> 
<div class="form-group"> 
       <label>Encryption Key :</label> 
       <input type="text" class="form-control" name="encryption" ng-model="my.user.encryption" > 
</div> 
</div>

等等......你在你的控制器实例上使用您的视图。

我改变了，但是没有定义$ scope的错误。 – Sasa

我想你不使用$范围，你使用var vm = this ?,如果是这样，用代码中的vm替换$ scope，我也要编辑它。 – urvashi

我正在使用这两个，我所使用的所有数据vm，只用于表单验证我使用$ scope。 – Sasa

答

无论何时您想使用模板内的控制器（或指令）中的数据，都必须将其绑定到控制器的$ scope。

.controller('myFormController', function() { 

    dataService.allOrganization().then(function (data) { 
     // Populate our scope the required data 
     $scope.allOrg = data; 
    }); 
});

现在我们可以使用ng-model将这些变量绑定到我们的表单域。
<input type="text" name="firstName" ng-model="allOrg.firstName">

并非所有的表单元素都表现相同。您应该查看角度文档以获取更多深入的表单绑定示例。
Angular form documentation

但如果我改变模型的名称如何从表单提交所有数据？我为ng-model user.etc命名，并以这种方式获取所有数据。 – Sasa

角度设置表单数据为所有字段

相关推荐