javascript - AngularJS + Onsen、ng-hide および ng-show が機能しない

Question

onsen フレームワークで AngularJS 1 を使用してアプリを開発しています。次の例を試しています。

CodePen の例

angular.module('myApp', ['onsen', 'ngAnimate']).controller('MyCtrl', function($scope) {
  $scope.groups = [];
  for (var i = 0; i < 10; i++) {
    $scope.groups[i] = {
      name: i,
      items: []
    };
    for (var j = 0; j < 3; j++) {
      $scope.groups[i].items.push(i + '-' + j);
    }
  }

  /*
   * if given group is the selected group, deselect it
   * else, select the given group
   */
  $scope.toggleGroup = function(group) {
    if ($scope.isGroupShown(group)) {
      $scope.shownGroup = null;
    } else {
      $scope.shownGroup = group;
    }
  };
  $scope.isGroupShown = function(group) {
    return $scope.shownGroup === group;
  };

});

ご覧の例では、要素に対して ng-show および ng-hide 関数を使用しています。

私は自分でコードを試してみましたが、ng-hide が機能していないため、リストを折りたたむことができませんでした。

angular-animate.js モジュールをダウンロードしてロードしましたが、機能しません。

任意のヒント？