Set 'value' input with AngularJS function

Question

I'm kinda noob with AngularJS I have the next div:

<div ng-app="" ng-controller="telController">

        Teléfono: <input type="text" ng-model="telefono.numero" ><br>
        <input type="text"  ng-model="telefono.tras"  > 
        <br>
        El telefono es: {{telefono.telefonoCodificado()}}

    </div>

The angularjs function is:

function telController($scope) {
            $scope.telefono = {
                numero: "",
                telefonoCodificado: function() {
                    var x;
                    x = $scope.telefono;

                    var parte1;
                    parte1= $scope.telefono.numero;
                    var telCodificado = parte1.substring(0, 3)+"-"+parte1.substring(3, 6)+"-"+parte1.substring(6, 10);

                    return "A) "+x.numero+" <<>> "+ telCodificado;
                },
                tras : function(){
                    var y; 
                    y = $scope.telefono.numero;
                    return y;
                }
            };
        }

I want the input with ng-model='telefono.tras' get filled with the value that have been typing in the input ng-model="telefono.numero" but that doesn´t happend, what am I doing wrong?

Naren Murali · Accepted Answer · 2017-09-29 19:08:59Z

1

New Answer:

After being updated on the issue, its better to use a ng-change to update the other variable.

JSFiddle Demo

Old Answer:

Hi There is no need to write a separate function to copy the ng-model (telefono.numero) to the variable telefono.tras, you can just assign the same variable. Like so.

JSFiddle Demo

Suppose you need telefono.tras populated for some function, then before calling the function, assign the telefono.numero value to telefono.tras.

So if you want to populate telefono.tras you can use the $watch() method to do this!

$scope.$watch('telefono.numero', function(newValue, oldValue){
    $scope.telefono.tras = newValue;
})

JSFiddle Demo

I hope this answer was useful, please let me know if there are any issues.

Suggestion: The input box is allowing numbers and text, to allow only numbers you need to add a directive, refer this link

edited Sep 29, 2017 at 19:08

answered Sep 29, 2017 at 18:41

Naren Murali

66.1k6 gold badges51 silver badges96 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Héctor Capulín Patiño Over a year ago

Thank you Naren, I was very helpful, but right now I regret about the way I ask the question. Suppose that I need to set the input with the function: telefonoCodificado?

Naren Murali Over a year ago

@HéctorCapulínPatiño Do you mean like this? example, please confirm the correctness for me to update my answer

Collectives™ on Stack Overflow

Set 'value' input with AngularJS function

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related