Проблема с обновлением локальной модели в angular xeditable

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

Со ссылкой на angularjs, по умолчанию xeditable обновляет локальную модель после нажатия кнопки "Сохранить". Но я хотел бы мгновенно обновить модель и показать обновленное значение в другом текстовом поле

<span editable-text="user.name" e-ng-model="user.name" e-name="name"></span>
<span editable-text="user.username" e-ng-model="user.username" e-name="username"></span>

Я включил пример рабочего кода в jsfiddle.


person Pravin    schedule 05.06.2014    source источник
comment
значение ng-model после нажатия кнопки сохранения обновляется   -  person Nidhish Krishnan    schedule 05.06.2014


Ответы (2)


@Pravin Я думаю, что нашел решение. У меня была ситуация, когда мне нужно обновить редактируемую модель, когда пользователь выбирает запись словаря при вводе с опережением. Я искал решение, и я нашел следующий способ:

<span editable-text="p.name" e-name="name" e-form="productForm" e-required
  e-typeahead="product as product.name for product in getProducts($viewValue) | filter:$viewValue | limitTo: 8"
  e-typeahead-editable="true" e-ng-maxlength="256" e-typeahead-focus-first="false"
  e-typeahead-on-select='onSelectProductFromDictionary($item, $model, productForm)'>
     {{ p.name }}
</span>

И метод, который обновляет редактируемые данные:

    $scope.onSelectProductFromDictionary = function ($item, $model, form) {

        angular.forEach(form.$editables, function(editable) {
            if (editable.name === 'name') {
                return;
            }
            editable.scope.$data = $model.something; // this is a dictionary model
            editable.save(); // move the value from edit input to view xeditable value
            editable.hide(); // hide the specific xeditable input if you needs
        });

    };

Я надеюсь, что это помогает.

ОБНОВЛЕНИЕ [JSFIDDLE]

https://jsfiddle.net/fLc2sdd2/

person Przemek Nowak    schedule 26.05.2015
comment
Не могли бы вы включить свое решение в скрипку? @przemek - person Pravin; 01.06.2015
comment
Я добавил пример скрипки. Вы можете попробовать выбрать состояние, а затем имя пользователя должно измениться. Можно еще поэкспериментировать... - person Przemek Nowak; 01.06.2015

Его обновление

Проверь это

Рабочая демонстрация

html

<h4>Angular-xeditable Editable form (Bootstrap 3)</h4>
<div ng-app="app" ng-controller="Ctrl">
 <form editable-form name="editableForm" onaftersave="saveUser()">
    <div>
      <!-- editable username (text with validation) -->
      <span class="title">Name: </span>
      <span editable-text="user.name" e-ng-model="user.name" e-name="name" e-required>{{ user.name || 'empty' }}</span>
    </div> 

    <div>
      <!-- editable username (text with validation) -->
      <span class="title">User name: </span>
      <span editable-text="user.username" e-ng-model="user.username" e-name="username" e-required>{{ user.username || 'empty' }}</span>
    </div>
    <div>

      <!-- button to show form -->
      <button type="button" class="btn btn-default" ng-click="editableForm.$show()" ng-show="!editableForm.$visible">
        Edit
      </button>


      <!-- buttons to submit / cancel form -->
      <span ng-show="editableForm.$visible">
        <button type="submit" class="btn btn-primary" ng-disabled="editableForm.$waiting">
          Save
        </button>
        <button type="button" class="btn btn-default" ng-disabled="editableForm.$waiting" ng-click="editableForm.$cancel()">
          Cancel
        </button>
      </span>
                <br> {{user}}
    </div>
  </form>  
</div>
person Nidhish Krishnan    schedule 05.06.2014
comment
Благодарю за ваш ответ. Но я пытаюсь: когда я ввожу значение в текстовое поле 1, оно должно обновлять текстовое поле 2, содержащее модель, значение которой зависит от модели 1. - person Pravin; 05.06.2014
comment
это означает, что при вводе вы хотите, чтобы значение данных было изменено в текстовом поле2 - person Nidhish Krishnan; 05.06.2014
comment
Моя конечная цель - 3 шага. 1. введите что-нибудь в текстовое поле1. 2. на основе текста в текстовом поле1 должна выполняться какая-то функция. 3.на основе этого он возвращает некоторое значение в текстовом поле2. Примечание. Это необходимо сделать до нажатия кнопки «Сохранить». - person Pravin; 05.06.2014
comment
@Pravin ты нашел решение? - person Przemek Nowak; 26.05.2015