Отключить ввод на основе поля динамической модели

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] (квадратные скобки в шаблоне являются привязкой для нового angularj), поэтому способ динамического изменения вашего отключенного состояния заключается в использовании ng- отключена директива следующим образом:

<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>