Hello Reader's if you are new to Angular JS then this blog is helpful to you. In this blog you can see how angular js can be used to generate the html. AngularJS enables you to create selectbox based on items in an array, or an object. So for this function we will be using the ng-optiondirective. So lets start this:
First create html file name it to angular.html
Then in the header section call the js file of angular with the syntax as follows:-
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<!DOCTYPE html>
<html>
<body>
<div ng-app="myApp" ng-controller="myCtrl">
<select ng-model="selectBranch" ng-options="x for x in names">
</select>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.names = ["Computer Science", "Information Technology", "Mechanical Engineering"];
});
</script>
<p>You can see the output box is generated above </p>
</body>
</html>
On the code above you can see all the objects written in $scope.name will be inserted as options in select box. Because the ng-repeat directive create and copy the special code syntax for html for every objects in the array, And now you can use them as to create options for select box, but the ng-options directive was made especially for filling a dropdown list with options.
Now remember the options inside the select box will be generated by ng-options which will be allowed as object, But the options generated by ng-repeat will be allowed as string.
0 Comment(s)