Wählen Sie Dropdown-Wert basierend auf Wert in DB

Question

Ich bin neu zu eckigen JS. Ich habe eine Dropdown-Box, in der statische Optionen mit Werten vorhanden sind. Basierend auf der Bedingung muss ich den Standardwert auswählen, der mit dem Wert aus Datenbank übereinstimmt. Wie kann es erreicht werden? model = "TemplateObj.IsActive" hat den int-Wert 0,1 oder 2 von DataBase.

<label class="">STATUS</label> 
 
<select class="form-control input-sm" style="border: none" required ng-model="TemplateObj.IsActive" > 
 
<option value="2">In Development</option> 
 
<option value="1">Active</option> 
 
<option value="0">InActive</option> 
 
</select>

Answer 1

Versuchen Sie ngOptions statt normal HTML select.

DEMO

var myApp = angular.module('myApp',[]); 
 

 
myApp.controller('MyCtrl',function($scope) { 
 
    
 
    $scope.status = [{ 
 
     title: 'In Development', 
 
     value: 2 
 
    }, { 
 
     title: 'Active', 
 
     value: 1 
 
    }, { 
 
     title: 'Inactive', 
 
     value: 0 
 
    }]; 
 
    
 
    $scope.TemplateObj = { 
 
    "IsActive": 1 
 
    } 
 
    
 
    
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="myApp" ng-controller="MyCtrl"> 
 
    <select ng-model="TemplateObj.IsActive" ng-options="option.value as option.title for option in status"></select> 
 
</div>

Answer 2

Verwenden ng-options Richtlinie mit Array von Zuständen. Die Syntax kann ein wenig für Anfänger kompliziert aussehen, aber Sie werden es lernen eines Tages: value as title for element in array

JS:

$scope.statuses = [{ 
    title: 'In Development', 
    value: 2 
}, { 
    title: 'Active', 
    value: 1 
}, { 
    title: 'Inactive', 
    value: 0 
}]; 

HTML:

<select ng-model="TemplateObj.IsActive" ng-options="status.value as status.title for status in statuses"></select> 

Hier ist jsfiddle mit Arbeitsbeispiel.

Answer 3

Eine Option wäre, die ng-Optionen Direktive zu verwenden.

Die Dokumentation ist here und es gibt einige Beispiele, die Sie führen können.