javascript – Select component problems

Question:

I'm having a problem displaying my list of items in my select.

In my HTML I use ng-repeat to list all items, and when my screen is loaded my first and only item is: {{list.name}} , when I click on this item {{list.name} , it loads the list correctly.

<select data-placeholder="Escolha uma Empresa/Filial" multiple chosen
                                style="width: 100%;"
                                ng-model="filtroRequisicao.codigoSistemaUsuariosFiliais"
                                required>
                            <option ng-repeat="list in lista" ng-value="list.id">
                                {{list.name}}
                            </option>
                        </select>

angularjs:

$scope.lista = [{}];

    //Carrega as Filiais dos Cooperados
        $scope.loadFiliais = function () {
            var usuario = localStorage.getItem("usuarioAutenticado");
            var objetoUsuario = {};

            objetoUsuario = JSON.parse(usuario);


            $http({
                method: 'PUT',
                url: '/getFiliais',
                data: objetoUsuario
            }).then(function (response) {

                    $scope.lista = response.data;

                    console.log($scope.lista);
                },

                function (response) {
                    console.log(response.data);
                    $scope.showNoty('Nenhum dado encontrado.', 'information');
                });
        };

        $scope.loadFiliais();

If anyone can give any tips, I'd appreciate it!

Answer:

I managed to solve it using ng-if, where it removes the element and creates it again according to the expression:

ngIf

angular:

Start the variable: $scope.lista = [] ;

calls the $scope.listaFiliais();

html:

<select data-placeholder="Escolha uma Empresa/Filial" multiple chosen
                                style="width: 100%;"
                                ng-if="lista.length > 0"
                                ng-model="filtroRequisicao.codigoSistemaUsuariosFiliais"
                                required>
                            <option ng-repeat="list in lista" ng-value="list.id">
                                {{list.name}}
                            </option>
                        </select>

I don't know if this is the best way, but it solved the problem.

Scroll to Top