Luiz Alves Luiz Alves - 3 years ago 152
AngularJS Question

Angularjs and typeahead, how getting rid off [object Object]

I have a view using a input text with uib-typeahead.
The input text is into a form.

When loading the view, the input text shows "[object Object]" about 5 seconds, before to be filled with the data loaded from remote server.
After the data to be loaded from remote server, all shows ok.

Is there a way to avoid this [object Object] into input text before the view is completelly loaded with the data from server?

I have tried ng-cloak but it has no effect.

//markup

<div class="col-sm-9 col-lg-9" id="scrollable-dropdown-menu">
<script type="text/ng-template" id="templatePac.html">
<div class="col-sm-12">
<a href>
<span ng-bind-html="match.model.nome | uibTypeaheadHighlight:query"></span>
<span> - CPF:</span>
<span ng-bind-html="match.model.cpf || 'sem cpf'"></span>
</a>
</div>
</script>
<input type="text" ng-model="paciente" required
uib-typeahead="item as item.nome for item in getPacientesByName($viewValue)"
ng-model-options="{ updateOn: 'default blur', debounce: {'default': 500, 'blur': 0}}"
typeahead-editable="false" typeahead-select-on-exact="true" query="query" typeahead-wait-ms="300" typeahead-loading="loadingLocationsPac" typeahead-template-url="templatePac.html" typeahead-no-results="noResultsPac" class="form-control">
<div>
<i ng-show="loadingLocationsPac" class="glyphicon glyphicon-refresh"></i>
<div ng-show="noResultsPac">
<i class="glyphicon glyphicon-remove"></i> Sem resultados
</div>
</div>
</div>


//js controller

angular.module('clinang').controller('menuPacientesEvolAtendAddController', function($scope,$state,$http) {
$scope.paciente={primeiro_atendimento:{prescricao_adotada:{medicamentos:[]}}};
...
...

$scope.getPacientesByName=function(val){
return $http.get(urlBase+'/configuracao',{params:val}).then( (response)=>{
return response.data
}, (erro)=>{
console.log(erro);
})
}

}

Answer Source

Could you modify $scope.paciente initial value to have "nome", field according to typeahead value in input, so typeahead could parse it properly? e.g.

$scope.paciente={nome: "", primeiro_atendimento:{prescricao_adotada:{medicamentos:[]}}};
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download