Untitled

<!DOCTYPE html>
<html ng-app="testApp">

  <head>
    <script data-require="angular.js@1.4.8" data-semver="1.4.8" src="https://code.angularjs.org/1.4.8/angular.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>

  <body ng-controller="testController">
    <h1>Languages</h1>
    <p>
      <label for="lang">Language: </label>
      <select id="lang" name="lang"
              ng-model="model.language"
              ng-options="language.key as language.value for language in languages">
        <option value="" disabled selected>-- Select a language --</option>
      </select>
    </p>
    <hr />
    <h2>Result:</h2>
    <pre>{{model|json}}</pre>
  </body>

</html>

// Code goes here

var app = angular.module("testApp", [])
.controller("testController", ["$scope", "$log", function($scope, $log) {
  $scope.model = {};
  
  $scope.getLanguages = function() {
    $scope.languages = [];
    $scope.languages.push({
      key : "en",
      value : "English"
    });
    $scope.languages.push({
      key : "fr",
      value: "French"
    });
    $log.debug("Languages: " + $scope.languages);
  };
  $scope.getLanguages();
}]);

/* Styles go here */