触发先前响应的组件中选择元件的角度1.5 ng变化

我刚刚开始玩Angular 1.5中的组件。x和为表单上的选择框创建了一个-我将字段、列表和标签传递给组件,它创建了表单“部分”,包括标签和具有正确选项的选择框-到目前为止,很好。

现在我想在select上实现一个ng更改,因此我传入了我想要用于此的函数。我的问题是,该函数是用旧值触发的,用于选择而不是新值。我可以看到该功能在实际更改之前触发。如果我将change函数放入组件更改事件中,它将正确注册,但不使用传入函数。

https://jsfiddle.net/7gd3m2k0/

<div ng-app="demoApp">
  <div ng-controller="RoleController as ctrl">
    <nac-select       
      field="ctrl.MemberRole.record.member" 
      list="ctrl.Lists.Member" 
      label="Member" 
      on-change="ctrl.MemberRole.changeMember();"></nac-select>
    <div ng-bind="ctrl.MemberRole.record.member.name"></div>
  </div>
</div>

angular.module('demoApp', [])
.component('nacSelect', nacSelect)
.controller('RoleController', roleController)

var nacSelect = {
bindings: {
            field: '=',
            list: '<',
            label: '@label',
            onChange: '&'
        },
        controller: function () {
            var ctrl = this;
            ctrl.change = function () {                    
                alert(ctrl.field.name); //gives new selection
                ctrl.onChange(); //gives previous selection
            }
        },
    template: `

    <label>{{$ctrl.label}}</label>
    <select ng-model="$ctrl.field" ng-options="r as r.name for r in $ctrl.list" ng-change="$ctrl.change();">
      <option value="">(Please Select)</option>
    </select>
`
};

var roleController = function(){
var ctrl = this;

  ctrl.Lists = {
Member: [
  {id: 1, name: 'Fred Smith'},
  {id: 2, name: 'Jenny Jones'},
  {id: 3, name: 'Jane Doe'}
]
  };

ctrl.MemberRole = {
record: {
    member: null
},
    changeMember: function(){
    alert(ctrl.MemberRole.record.member.name);    
    }  
  };
};

我想我错过了一些简单的东西,但我想不出来。谢谢你的帮助