anglejsディレクティブのFoundation5アコーディオンが例外をスローします

anglejsディレクティブによって生成されたアコーディオンをクリックすると、次のエラーが発生します。動的に作成されたコンテンツに関係する以外に、なぜこれが発生するのかについての手がかりを実際に見つけることはできません。これらの手がかりは、angularjsコントローラー内で再びfoundationを呼び出すように指示します。私は何が欠けていますか？

Unhandled exception at line 58, column 7 in
http://localhost:58753/Scripts/foundation/foundation.js

0x800a139e - JavaScript runtime error: SyntaxError

ここで起こります

var S = function (selector, context) {
    if (typeof selector === 'string') {
      if (context) {
        var cont;
        if (context.jquery) {
          cont = context[0];
          if (!cont) return context;
        } else {
          cont = context;
        }
        return $(cont.querySelectorAll(selector));
      }

      return $(document.querySelectorAll(selector));
    }

    return $(selector, context);
  };

私のテンプレート

<dl class="accordion" data-accordion>
    <dd ng-repeat="x in myCollection | filter: { ParentId :'!', Checked : true }"> 
        <a href="#{{x.Id}}"> {{x.Description}}</a>
        <div id="{{x.Id}}" class="content">
            asdf
        </div>
    </dd>
</dl>

私の指令

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

function myDir() {
    "use strict";

    function link(scope, elem, attr) {

    }

    function ctrl(scope) {

    };

    ctrl.$inject = ['$scope'];

    var ddo = {
        restrict: 'E',
        transclude: false,
        replace: false,
        templateUrl: '/AngularTemplates/ScopePicker',
        link: link,
        controller:ctrl,
        scope: {
            myCollection: '='
        }
    };

    return ddo;
}

myApp.directive('myDir', myDir);

私のコントローラー

function MyCtrl(scope,http) {
    http.get('/api/somethingcool').success(function (result) {
        scope.foo = result;  // gets passed into myColleciton for the directive
        angular.element(document).foundation();
    });
}