2014-11-19 2 views
0

В моем контроллере, у меня есть простой массив и функция:формы не добавляя к массиву и очисток

$scope.newGuarantor = ''; 
$scope.guarantors = [ 
    {guarantor: 'Peter Parker'}, 
    {guarantor: 'Bruce Wayne'} 
]; 

$scope.addGuarantor = function(){ 
    $scope.guarantors.push({ 
     guarantor: $scope.newGuarantor 
    }); 
    $scope.newGuarantor = ''; 
}; 

В представлении У меня есть простой список и форма:

<tr ng-repeat="pg in guarantors"> 
    <td>{{pg.guarantor}}</td> 
</tr> 
<tr> 
    <td> 
     <form ng-submit="addGuarantor()"> 
      <input type="text" ng-model="newGuarantor"/> 
      <button type="submit"> 
       <span class="glyphicon glyphicon-plus"></span> 
      </button> 
     </form> 
    </td> 
</tr> 

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

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

Может ли кто-нибудь увидеть, что я пропустил?

+1

Попробуйте создать plunker или скрипку, чтобы продемонстрировать проблему –

+1

я createad JSFiddle с кодом, и он отлично работает: http://jsfiddle.net/gbfgs0fo/3/ –

+0

Так запутался ... код работает в jsFiddle, но на моей странице я получаю пустую строку и полный ввод и никаких ошибок в консоли. Чтобы убедиться, что это не был глупый тип, я копировал и вставлял код со скрипта в свою попытку. – jgravois

ответ

-1

После того, как вы нажмете guarantor: $scope.newGuarantor, ваш сброс $scope.newGuarantor. поэтому затем нажатое значение будет сброшено из-за сброса $scope.newGuarantor.

Если вам нужно нажать новый объект, не влияя на сброс $scope.newGuarantor, вы можете использовать angular.copy(), он создаст новую копию variable, и на эту копию не повлияет исходное значение. это означает, что если и изменить исходное значение, значение копии не изменится. Таким образом, нет никаких отношений между исходными и копирующими переменными.

$scope.addGuarantor = function(){ 
var objVal = angular.copy($scope.newGuarantor); 
$scope.guarantors.push({ 
    guarantor: objVal 
}); 
$scope.newGuarantor = ''; 

};

+0

Я, должно быть, пропустил что-то еще, потому что объяснение имеет смысл, но этот код дает мне тот же результат - новую пустую строку и вход еще заполнен. – jgravois

+3

Это не правильный ответ. Код OP отлично работает в первую очередь. Более того, простые значения (такие как строки) всегда передаются копией, а не ссылкой в ​​JavaScript. Вот почему вызов «copy» в строке не изменит способ работы этого кода. –

0

Не уверен, почему это работает, но я изменил контроллер на это, и она работает

$scope.newGuarantor = {}; 
$scope.addGuarantor = function() { 
    $scope.guarantors.push($scope.newGuarantor); 
     $scope.newGuarantor = {}; 
    }; 

мнение изменилось на:

<tr ng-repeat="pg in guarantors"> 
        <td>{{pg.guarantor}}</td> 
       </tr> 
       <tr> 
        <td> 
         <form ng-submit="addGuarantor()"> 
          <input type="text" ng-model="newGuarantor.guarantor"/> 
          <button type="submit">       <span class="glyphicon glyphicon-plus"></span> 
          </button> 
         </form> 
        </td> 
       </tr> 
Смежные вопросы