$ scope does not visually refresh the data I fill in with JavaScript

0

I'm filling my $scope via JavaScript using the following code:

    myApp.controller('gruposController', ['$scope', '$http', '$window', 'usuariosFactory', '$timeout', function ($scope, $http, $window, membrosFactory, $timeout) {
    // Cria um namespace para os dados do formulário
    $scope.formData = {
        /* Inicializa os participantes / aprovadores para que não seja preciso
         * validar no controller principal
         */
        participantes: [],
        aprovadores: []
    };

    // [...]
    function atualizarGrupo(id) {
    // Promisse para processar a requisição
    var grupoPromise = $scope.getGrupo(id);
    grupoPromise.then(
        // Função para executar caso tudo ocorra normalmente
        function(response) {
            // Mostra a tela
            $('.fancy-inline-group[href="#add-group"]').click();

            var grupo = angular.fromJson(response.data);

            $scope.formData.grupo = grupo.grupo;
            $scope.formData.descricao = grupo.descricao;

            // Reseta os participantes e aprovadores
            $scope.formData.aprovadores = [];
            $scope.formData.participantes = [];
            var usuarios = grupo.usuarios;

            // Lógica para preencher os aprovadores e participantes
            if (usuarios.length > 0) {
                angular.forEach(usuarios, function(usuario, key) {
                    var usuarioID = usuario.id;
                    $scope.formData.participantes.push(usuarioID);
                    if (usuario.pivot.aprovador == 1) {
                        $scope.formData.aprovadores.push(usuarioID);
                    }
                });
            }

            // Aplica as mudanças ao objeto $scope
            $timeout(function() {
                console.log($scope.formData);
                $scope.$apply();
            });
        },
        function(response) {
            console.log('Error: ' + response.statusText);
        }
    );
}

Below is the HTML:

    <div id="add-group" ng-controller="gruposController">
    <h1><strong>Adicionar</strong> Grupo</h1>
    <hr />
    <form action="" class="form-horizontal">
        <input type="hidden" name="id" value="" ng-model="formData.id" />
        <div class="form-group">
            <label for="name" class="col-sm-2 control-label">Nome do grupo*</label>
            <div class="col-sm-10">
                <input type="text" name="grupo" ng-model="formData.grupo" class="form-control" value="" required="required" placeholder="">
            </div>
        </div>
[...]

Binding when entering a value in the inputs occurs correctly, just as when I run a console.log($scope) it shows the correct data, but the inputs do not update on the form . I saw that running $scope.$apply() on $timeout would theoretically update my $scope visually, but that did not happen.

    
asked by anonymous 18.10.2015 / 21:31

0 answers