При использовании Angular.js, как сохранить данные формы после отправки?

я использовал базовую угловую скрипт, который когда-либо обновление, что вы вводите в поле ввода на любом элементе мы указываем, в реальном масштабе времени ...При использовании Angular.js, как сохранить данные формы после отправки?

<!doctype html> 
    <html ng-app> 
    <head> 
     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script> 
    </head> 
    <body> 
     <div> 
     <label>Name:</label> 
     <input type="text" ng-model="yourName" placeholder="Enter a name here"> 
     <hr> 
     <h1>Hello {{yourName}}!</h1> 
     </div> 
    </body> 
    </html>

Im новой для Угловое. Я использовал это в приложении rails. Но проблема в том, что поле, которое я использовал ng-model, сбросит его стоимость после отправки. Даже установка атрибута 'value' не будет работать. Как я могу это исправить?

Точный код, генерируемый из приложения рельсов:

<form accept-charset="UTF-8" action="/members" class="custom" id="new_member" method="post"> 

     <div class="row collapse text-field"> 
     <div class="small-4 columns"> 
      <h3>Add Member : </h3> 
     </div> 
     <div class="small-6 columns left inline"> 
      <h3 class="subheader inline">&nbsp;{{newEntry.name}}</h3> 
     </div> 
     </div> 



     <div class="row collapse text-field"> 
      <div class="small-3 columns"> 
      <label class="prefix" for="member_name">Full Name</label> 
      </div> 
      <div class="small-7 columns left"> 
      <input class="input" id="member_name" name="member[name]" ng-model="newEntry.name" type="text" value="gj" /> 
      </div> 
     </div> 


     <div class="row collapse text-field"> 
      <div class="small-3 columns"> 
      <label class="prefix" for="member_address">Address</label> 
      </div> 
      <div class="small-9 columns"> 
      <textarea class="input" height="115" id="member_address" name="member[address]"> 
      </textarea> 
      </div> 
     </div> 

     <div class="row"> 
      <div class="small-9 columns" ><input class="button radius" name="commit" type="submit" value="Add Member" /></div> 
     </div> 
</form>

Примечание: Я не использовал нг-контроллер. Im новый для Angular. Если это необходимо, сообщите мне, как преобразовать вышеуказанное в контроллер. Я могу получить значение поля и отправить его обратно в форму в рельсах. Его там в переменной. Но Угловая держит его!

Note2: Эта проблема сохраняется только для поля ввода. Я использовал угловую модель. Все остальные поля сохранили данные!

источник

2013-08-09 THpubs

Когда вы говорите «submit», что вы представляете? - В вашем примере нет формы или кнопки отправки. Возможно, если вы укажете точный код, который вы пытаетесь использовать вместе с вашим угловым контроллером? Имейте в виду, что углы не сохраняют данные между запросами. Вам необходимо будет записать эти данные в локальное хранилище/файл cookie или отправить серверную часть для хранения в базе данных, а затем перезагрузить и назначить обратно переменной '$ scope.yourName' в вашем контроллере –

@JoeGreen Извините за проблему :) Я включил полный код. Данные поля могут быть получены после отправки через рельсы. Я попытался добавить это значение в качестве атрибута value в поле ввода. Но угловые салфетки это. Эта проблема сохраняется только для поля ввода. Я использовал угловую модель. Все остальные поля сохранили данные! – THpubs

Хорошо это не самое лучшее решение, но вы можете сделать это:

<input type="text" ng-init="yourName = 'Your Value Goes Here'" ng-model="yourName" placeholder="Enter a name here">

нг-INIT директивы выполняются, когда приложение intialises, поэтому ваше значение будет присвоено внутренней модели угловых в «ВашеИмя» и соответственно обновляться в представлении.

Это решит вашу проблему, но это не самый лучший способ. Надеюсь, это заставит вас идти сейчас - я попытаюсь опубликовать более «идеальное» решение в ближайшее время.

источник

2013-08-09 14:54:06

Отлично! Спасибо, что сработало! После преобразования в Ruby это выглядит так: 'ng-init' => "newEntry.name = '#{@member.name}'". Я буду ждать лучшего ответа, если вы считаете, что это не подходит до завтра. Если нет хорошего ответа, я соглашусь с этим. – THpubs

При использовании Angular.js, как сохранить данные формы после отправки?

ответ

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