2016-08-18 2 views
0

Угловое и Ионные ПрименениеОчистить нг-модель затем Обновить нг-модель с новым значением

У меня есть форма, которая имеет много <select> элементов, форма предлагает пользователю выбрать из списка или if the <option> = 'Other' then I show another <input>, чтобы войти в стоимость. Затем я сохраняю значение до другого ng-model.

<select data-ng-model="minor.tests.liveEarth" 
       name="minorTestLiveEarth" 
       required> 
      <option></option> 
      <option>>200</option> 
      <option>>299</option> 
      <option>>500</option> 
      <option>>1000</option> 
      <option>Other</option> 
     </select> 
     </label> 
     <label class="item item-input item-stacked-label" ng-show="minor.tests.liveEarth === 'Other'"> 
     <span class="input-label">Please Specify</span> 
     <input type="text" 
       placeholder="live earth other" 
       ng-maxlength="10" 
       data-ng-model="minor.tests.liveEarthOther" 
       name="minorTestLiveEarthOther"> 
     </label> 

Первоначально Я использовал <datalist>, но не отображается на iOS.

я назначил liveEarthOther к таким же, как <select> liveEarth но он 'Other' назначен на нг-модель, то пользователь должен удалить значение входного Other перед входом их стоимости.

Я искал элемент управления combobox, но не нашел тот, который работает правильно.

Как я могу сделать это в директиве или любой подходящей вещи, которая могла бы выполнять переименование без необходимости удаления пользователя.

Я хочу использовать эту функцию много раз в приложении, которое я создаю.

ответ

0

Возможно, у вас возникли сложности при повторном использовании ngModel. Если вы измените значение minor.tests.liveEarth, вы испортите свой выбор, потому что ничего, кроме заданных, ничего не выберет. Но если вы не измените minor.tests.liveEarth, тогда вам нужно будет удалить его, когда пользователь заполнит ввод текста. Тогда было бы также испортить поле выбора!

Что бы я сделал, это записать значение ввода текста в другую переменную. Держите ng-show="minor.tests.liveEarth === 'Other'", как это, но изменить свой вклад в

<input type="text" 
    placeholder="Fill in your other live earth" 
    ng-maxlength="10" 
    data-ng-model="tempVar" /> 

Таким образом, вход будет по-прежнему быть записан, но выбор не будет перепуталось на изменении ngModel. Из-за placeholder пользователь узнает, что он должен заполнить текстовое поле.

В ваших JS, вам придется создать проверяющую функцию, когда форма передаются по линиям:

var validateLiveEarth = function(){ 
    if(minor.tests.liveEarth === "Other"){ 
    //check that tempVar meets validation 
    //assign tempVar to whatever form you're sending 
    } 
} 
+0

Спасибо за вашу помощь это дало мне возможность проверить и присвоить мою модель. – StudentRik

Смежные вопросы