Edit modal record with Angularjs

Question

I have a modal to edit user and when you have ng-model in input it does not display the value to edit. What I might be doing wrong.

$scope.updateUser = function(userId){
    var id = userId;
    $http.get("models/retornaUser.php?id=" + id).then(function(response) {
        $scope.user = response.data;
        $scope.userLogin = $scope.user[0].userLogin;
        $scope.userName = $scope.user[0].userName;
        $scope.userFone = $scope.user[0].userFone;
        $scope.userEmail = $scope.user[0].userEmail;
        $scope.userNivel = $scope.user[0].userNivel;
    });
}

// button qe chama a modal passando id
<button class="btn btn-sm btn-indigo px-2" ng-click="updateUser(user.userId)" data-toggle="modal" data-target="#modalUser"><i class="fa fa-pencil fa-lg"></i></button>

// input modal com validacao de telefone
<div class="form-group col-sm-4">
  <label for="userUFone">Fone</label>
  <input type="text" name="userUFone" class="form-control form-control-sm" id="userUFone" ng-model="formDataUp.userUFone" ui-br-phone-number-mask maxlength="15" value="{{userFone}}">
</div>

Answer 1

Hello all right? Then the value you want to start in the input must be filled by ng-model, in it will occur the data-bind! From what I understand you load the initial value of an endpoint and want to edit it and assign to formDataUp.userUFone. So I believe you can do it this way:

 $scope.updateUser = function(userId){
    var id = userId;
    $http.get("models/retornaUser.php?id=" + id).then(function(response) {
        $scope.user = response.data;
        $scope.userLogin = $scope.user[0].userLogin;
        $scope.userName = $scope.user[0].userName;
        $scope.userFone = $scope.user[0].userFone;
        $scope.userEmail = $scope.user[0].userEmail;
        $scope.userNivel = $scope.user[0].userNivel;
        $scope.formDataUp.userUFone = $scope.userFone;
    });
}

// button qe chama a modal passando id
<button class="btn btn-sm btn-indigo px-2" ng-click="updateUser(user.userId)" data-toggle="modal" data-target="#modalUser"><i class="fa fa-pencil fa-lg"></i></button>

// input modal com validacao de telefone
<div class="form-group col-sm-4">
  <label for="userUFone">Fone</label>
  <input type="text" name="userUFone" class="form-control form-control-sm" id="userUFone" ng-model="formDataUp.userUFone" ui-br-phone-number-mask maxlength="15">
</div>

I removed the input value and updated the formDataUp.userUFone model when the value is loaded from endpoint.

Any questions about how the loading of the input works at the angle can see here