AngularJS嵌套的ng-repeat不会修改模型

<div ng-controller="MyController as ctrl">
  <div ng-repeat="item in ctrl.items">
    <span>{{item.name}}</span>
    <div ng-repeat="subItem in item.subItems">
      <span>{{subItem.name}}</span>
      <button ng-click="ctrl.modifyModel(item, subItem)">修改</button>
    </div>
  </div>
</div>

angular.module('myApp', [])
  .controller('MyController', function() {
    var vm = this;

    vm.items = [
      { name: 'Item 1', subItems: [{ name: 'Sub Item 1' }, { name: 'Sub Item 2' }] },
      { name: 'Item 2', subItems: [{ name: 'Sub Item 3' }, { name: 'Sub Item 4' }] }
    ];

    vm.modifyModel = function(item, subItem) {
      // 在这里修改模型
      // 例如：subItem.name = 'New Name';
    };
  });