Weird Bugs

This is an example of how weird bugs can get.

by Michael Perrenoud

HTML

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.14/angular-messages.js"></script>
<div ng-app="myApp">
    <div ng-controller="MyCtrl">
         <h3>{{currentquestion.text}}</h3>

        <select ng-model="currentquestion.metric_pref" name="{{currentquestion.qid}}" id="{{currentquestion.qid}}">
            <option ng-value="kg" ng-selected="currentquestion.metric_pref == 'kg'">kg.</option>
            <option ng-value="lbs" ng-selected="currentquestion.metric_pref == 'lbs'">pounds</option>
            <option ng-value="stn" ng-selected="currentquestion.metric_pref == 'stn'">stones</option>
        </select>Current Value: {{currentquestion.metric_pref}}</div>

        <select ng-model="currentquestion.metric_pref" name="{{currentquestion.qid}}" id="{{currentquestion.qid}}">
            <option value="kg" ng-selected="currentquestion.metric_pref == 'kg'">kg.</option>
            <option value="lbs" ng-selected="currentquestion.metric_pref == 'lbs'">pounds</option>
            <option value="stn" ng-selected="currentquestion.metric_pref == 'stn'">stones</option>
        </select>Current Value: {{currentquestion.metric_pref}}</div>
</div>

JavaScript

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

myApp.controller("MyCtrl", function ($scope) {
    $scope.currentquestion = {};
    $scope.currentquestion.qid = "QS1";
    $scope.currentquestion.text = "What unit do you prefer to state your weight in?";
    $scope.currentquestion.metric_pref = 'stn';
});