Question

我正在使用json表单模板文件为我的表单动态生成模型。

示例JSON：

{
    "displayName":"EID",
    "internalName":"EID",
    "fieldType":"text"
},
{
    "displayName":"Name",
    "internalName":"PersonName",
    "fieldType":"text"
},

表单HTML：

<div class="item-inner" ng-if="f.fieldType == 'text'">
   <div class="item-title item-label">{{f.displayName}}</div>
   <div class="item-input-wrap">
        <input type="text" placeholder="" name="{{f.internalName}}"
               ng-model="formData[f.internalName]"
               [disabled]="formData['EID'].length >1">
        <span class="input-clear-button"></span>
   </div>
</div>

JS档案：

$scope.formData = {};

$scope.submit = function () {
            $http({
                method: 'POST',
                url: '/api/postForm',
                data: JSON.stringify(this.formData),
                headers: { 'Content-Type': 'application/json' }
            }).then(function (response) {
                console.log(response);
                alert('success');
            }, function (error) {
                alert('fail');
            });
        };

似乎没有用的是我的禁用声明 - 如果EID输入字段中有值，我试图禁用任何字段。我不确定如何引用动态模型名称。我也预见到输入后EID字段禁用自身的问题。

Answer 1

正如评论中提到的那样，angularjs中没有[disabled]（模板中的方括号是新角度的绑定），因此动态更改禁用状态的方法是使用ng-disabled指令如下：

<div class="item-inner" ng-if="f.fieldType == 'text'">
   <div class="item-title item-label">{{f.displayName}}</div>
   <div class="item-input-wrap">
      <input type="text" placeholder="" name="{{f.internalName}}"
           ng-model="formData[f.internalName]"
           ng-disabled="formData[f.internalName].length >1"/>
      <span class="input-clear-button"></span>
   </div>
</div>

根据动态模型字段禁用输入

1 个答案: