Search code examples
angularjscordovaionic-frameworkngcordova

How can I get updated value from ng-model in my controller


I am trying to get the updated value from my view like this:

<label class="item item-input">
          <span class="input-label">Palabra</span>
          <input style="font-size: 18px !important; text-align: right !important; font-weight: bold !important;" type="text" ng-model="addWordContent" placeholder="pa-la-bra">
        </label

I initialize the value of $scope.addWordContent in NULL:

$scope.getEditPalabraRow = function($stateParams) {
    Words.getEditSimple($stateParams.palabraId).then(function(single){
      $scope.editWordRow = single;
      $scope.addWordContent = null;
      /*$scope.nodiacriso = Utilities.removeAccents($scope.editWordRow.sound_title);
      $scope.mintitle =  $filter('lowercase')($scope.nodiacriso);
      $scope.nodiacri = Utilities.removeAccents($scope.editWordRow.title);*/
      $scope.getEditLetter($scope.editWordRow);
      
          
    });

So I need to use the updated ng-model value when the user types a new word in the html <input>, then save it in my database, I am trying this in my controller:

Words.addWord($scope.addWordContent, $scope.imgURI,  src, $scope.letter.letter_id, title);

Words is a service.

When I try to save the word the value still in NULL, never changes when the user fill the input text field. Regards!!


Solution

  • There is an article about scopes in angularjs wiki - https://github.com/angular/angular.js/wiki/Understanding-Scopes

    I think this may be your case:

    Scope inheritance is normally straightforward, and you often don't even need to know it is happening... until you try 2-way data binding (i.e., form elements, ng-model) to a primitive (e.g., number, string, boolean) defined on the parent scope from inside the child scope. It doesn't work the way most people expect it should work. What happens is that the child scope gets its own property that hides/shadows the parent property of the same name. This is not something AngularJS is doing – this is how JavaScript prototypal inheritance works. New AngularJS developers often do not realize that ng-repeat, ng-switch, ng-view and ng-include all create new child scopes, so the problem often shows up when these directives are involved.