Вариант Angular 1.5 с нг-сменой

Question

У нас есть этот JSON

{
  "Day": "Monday",
  "Start_Time": "08:00"
},
{
  "Day": "Tuesday",
  "Start_Time": "10:00"
},
{
  "Day": "Thursday",
  "Start_Time": "08:00"
}

Поэтому я пытаюсь сделать так, чтобы эти дни появлялись внутри HTML select пункт с этими опциями. Что-то вроде этого

<select>
 <option>Monday 08:00</option>
 <option>Tuesday 10:00</option>
 <option>Thursday 08:00</option>
</select>

И когда пользователь меняет опцию, я хотел бы распечатать новую опцию, которую он сделал, здесь я застрял.

Что я сделал до сих пор.

  <select ng-if="student.diwro" >
                    <option ng-repeat="x in modules" ng-selected="student.diwro == x.Anatheseis_Id" >{{x.Day}} {{x.Start_Time}}</option>
                  </select>

Но HTML-элемент option не имеет ng-change,

Любая идея о том, как я могу консоль журнала изменения дня?

Большое спасибо!

Answer 1

<select ng-if="student.diwro" ng-change="change()" ng-model="selectedValue">
    <option ng-repeat="x in modules" ng-selected="student.diwro == x.Anatheseis_Id" >{{x.Day}} {{x.Start_Time}}</option>
</select>

Answer 2

Использование ng-options который может быть более настраиваемым,

'use strict';

var app = angular.module('myApp', []);
app.controller('AppCtrl', function($scope){
$scope.student = {}
    $scope.modules = [
        {
            "key": "all",
            "value": "For any event on all my projects"
        },
        {
            "key": "selected",
            "value": "For any event on the selected projects only..."
        },
        {
            "key": "only_my_events",
            "value": "Only for things I watch or I'm involved in"
        },
        {
            "key": "only_assigned",
            "value": "Only for things I am assigned to"
        },
        {
            "key": "only_owner",
            "value": "Only for things I am the owner of"
        },
        {
            "key": "none",
            "value": "No events"
        }
    ];

$scope.setdiwro = function()
{
alert($scope.student.diwro.key)
}
  
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.22/angular.min.js"></script>
<div ng-app="myApp">
    <div ng-controller="AppCtrl">
        {{message}} <br />
        
        <!--Options value is defualt 0, 1 ... and it's non change able -->
        <span>Default Otions:</span>
        
 <select ng-model="student.diwro" ng-options="x.key for x in modules" ng-change="setdiwro()">
            <option value="">Select A Value</option>
</select>
        <br />
    
        <br />                
    </div>
</div>