Default Value Dropdown AngularJS
In my project I have a dropdown, iterated from an array. Note that in the array I have a key called default that is set to true or false. I would like the dropdown defalt value to be whatever comes with the key set to true.
If I do this: $scope.nfe.naturezaOperacao = $scope.cfops[0];
, it works, however, I am setting static, I would like it to set the default according to the default key.
JS:
angular.module('nfe', []).controller('nfeController', function ($scope, $http) {
$scope.nfe = [];
$scope.cfops = [
{codigo: "5.102", descricao : "Venda a vista 12%", elo: "012", default: false},
{codigo: "5.102", descricao : "Venda a vista 17%", elo: "017", default: true}
];
//$scope.nfe.naturezaOperacao = $scope.cfops[0];
});
HTML:
<select
class="form-control"
name="NF_NATUREZA_OPERACAO"
id="NF_NATUREZA_OPERACAO"
data-ng-model="nfe.naturezaOperacao"
data-ng-init=""
data-ng-options="cfop.descricao for cfop in cfops">
</select>
0
Author: Cristiano Junior, 2017-07-02
2 answers
Whereas only A object inside the array cfops
will have the property default
with the value true
, you can inject $filter
in your controller and use the first position returned by this function (I added more objects to the array to exemplify the operation):
angular
.module('nfe', [])
.controller('nfeController', function ($scope, $http, $filter) {
$scope.nfe = [];
$scope.cfops = [
{codigo: "5.102", descricao : "Venda a vista 12%", elo: "012", default: false},
{codigo: "5.102", descricao : "Venda a vista 17%", elo: "017", default: true},
{codigo: "5.102", descricao : "Venda a vista 10%", elo: "010", default: false},
{codigo: "5.102", descricao : "Venda a vista 11%", elo: "011", default: false},
{codigo: "5.102", descricao : "Venda a vista 12%", elo: "012", default: false},
{codigo: "5.102", descricao : "Venda a vista 13%", elo: "013", default: false}
];
$scope.nfe.naturezaOperacao = $filter('filter')($scope.cfops, { default: true })[0];
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="nfe" ng-controller="nfeController">
<select
class="form-control"
name="NF_NATUREZA_OPERACAO"
id="NF_NATUREZA_OPERACAO"
data-ng-model="nfe.naturezaOperacao"
data-ng-init=""
data-ng-options="cfop.descricao for cfop in cfops">
</select>
</div>
0
Author: mercador, 2017-07-02 21:42:54
This Way is incorrect? What would be the best way to do this?
/* SETA O CFOP PADRÃO */
for (var i in $scope.cfops) {
if ($scope.cfops[i].cfop_padrao == true) {
$scope.nfe.naturezaOperacao = $scope.cfops[i];
} else {
$scope.nfe.naturezaOperacao = $scope.cfops[0];
}
}
angular
.module('nfe', [])
.controller('nfeController', function ($scope, $http, $filter) {
$scope.nfe = [];
$scope.cfops = [
{codigo: "5.102", descricao : "Venda a vista 12%", elo: "012", default: false},
{codigo: "5.102", descricao : "Venda a vista 17%", elo: "017", default: true},
{codigo: "5.102", descricao : "Venda a vista 10%", elo: "010", default: false},
{codigo: "5.102", descricao : "Venda a vista 11%", elo: "011", default: false},
{codigo: "5.102", descricao : "Venda a vista 12%", elo: "012", default: false},
{codigo: "5.102", descricao : "Venda a vista 13%", elo: "013", default: false}
];
$scope.nfe.naturezaOperacao = $filter('filter')($scope.cfops, { default: true })[0];
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="nfe" ng-controller="nfeController">
<select
class="form-control"
name="NF_NATUREZA_OPERACAO"
id="NF_NATUREZA_OPERACAO"
data-ng-model="nfe.naturezaOperacao"
data-ng-init=""
data-ng-options="cfop.descricao for cfop in cfops">
</select>
</div>
0
Author: Cristiano Junior, 2017-07-02 23:56:28