AngularJS形式的动态ng模型名称

发布时间：2020-12-17 09:28:48 所属栏目：安全来源：网络整理

导读：我有一个AngularJS表单,我使用ng-repeat来基于另一个选择动态构建表单的字段.我试图动态地生成模型名称,并遇到问题. div class="form-group" ng-repeat="parameter in apiParameters" label for="{{parameter.paramName}}" class="col-sm-2 control-label"{{

我有一个AngularJS表单,我使用ng-repeat来基于另一个选择动态构建表单的字段.我试图动态地生成模型名称,并遇到问题.

<div class="form-group" ng-repeat="parameter in apiParameters">
  <label for="{{parameter.paramName}}" class="col-sm-2 control-label">{{parameter.paramTitle}}</label>
  <div class="col-sm-3">
    <input type="text" class="form-control" name="{{parameter.paramName}}" id="{{parameter.paramName}}" ng-model="formData.parameters.{{parameter.paramName}}" placeholder="{{parameter.paramTitle}}">
  </div>
</div>

我需要的是eval,像ng-model =“formData.parameters.fooId”或ng-model =“formData.parameters.barId”

以上结果出现错误：
错误：[$parse：syntax]语法错误：从[{{parameter.paramName}}]开始,令牌'{‘是表达式[formData.parameters.{{parameter.paramName}}]的第21列的意外令牌.

在我的控制器我有：

$scope.formData = {};
$scope.formData = {
  settings:
  {
    apiEndpoint: '',method: 'get'
  },parameters: {}
};

我也尝试过ng-model =“formData.parameters.[parameter.paramName]”(基于这个问题How can I set a dynamic model name in AngularJS?),但是没有eval,并且没有设置ng模型值.我不知道我想要完成什么甚至是可能的.我假设我需要通过控制器来实现我想要的,但是任何帮助将不胜感激.

您只需要使用散列键作为模型：

<div class="form-group" ng-repeat="parameter in apiParameters">
  <label for="{{parameter.paramName}}" class="col-sm-2 control-label">{{parameter.paramTitle}}</label>
  <div class="col-sm-3">
    <input type="text" class="form-control" name="{{parameter.paramName}}" id="{{parameter.paramName}}" ng-model="formData.parameters[parameter.paramName]" placeholder="{{parameter.paramTitle}}">
  </div>
</div>

还有很多其他的方法,但是比其他方法更简单.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!