Javascript AngularJs，引导，弹出错误

有人能告诉我为什么我的弹出窗口不工作吗？我在Angularjs中使用了table sorter，但是当点击链接时，弹出窗口不会显示出来

Test1.html

<div ng-controller="DemoCtrl">
<table ng-table="tableParams" class="table table-striped 
 table-condensed table-hover"     border ="1">
    <tr ng-repeat="user in $data">
        <td data-title="'Event Id'" sortable="'event_id'">
         <div ng-contorller="MyCtrl">
        <a href="#"  ng-click='toggleModal()'>{{user.name}} </a>

        <modal-dialog show='modalShown' width='400px' height='60%'>
  <p>Modal Content Goes here</p>
</modal-dialog>
        </div>

        </td>
        <td data-title="'Event Date & Time'" sortable="'event_date'">
            {{user.age}}
        </td>
          <td data-title="'Event Type'" sortable="'event_type'">
            {{user.age}}
        </td>
          <td data-title="'Serverity'" sortable="'serverity'">
            {{user.age}}
        </td>
          <td data-title="'Device Name'" sortable="'device_name'">
            {{user.age}}
        </td>
          <td data-title="'User Name'" sortable="'user_name'">
            {{user.age}}
        </td>
          <td data-title="'Mail Sent Time'" sortable="'mail_sent'">
            {{user.age}}
        </td>
          <td data-title="'Mail Status'" sortable="'mail_status'">
            {{user.age}}
        </td>
          <td data-title="'Remarks'" sortable="'remarks'">
            {{user.age}}
        </td>
    </tr>

    </table>
</div>
</div>

模态内容在这里

{{user.age}
{{user.age}
{{user.age}
{{user.age}
{{user.age}
{{user.age}
{{user.age}
{{user.age}

script.js

var app = angular.module('main', ['ngTable']);
app.directive('modalDialog', function() {
          return {
            restrict: 'E',
            scope: {
              show: '='
            },
            replace: true, // Replace with the template below
            transclude: true, // we want to insert custom content 
            link: function(scope, element, attrs) {
              scope.dialogStyle = {};

              if (attrs.width)
                scope.dialogStyle.width = attrs.width;

              if (attrs.height)
                scope.dialogStyle.height = attrs.height;
              scope.hideModal = function() {
                scope.show = false;
              };
            },
            template: "<div class='ng-modal' ng-show='show'>
    <div  class='ng-modal-overlay' ng-click='hideModal()'></div>
  <div class='ng-modal-dialog' ng-style='dialogStyle'>
  <div class='ng-modal-close' ng-click='hideModal()'>X</div>
  <div class='ng-modal-dialog-content' ng-transclude></div></div></div>"
          };
        });
  app.controller('DemoCtrl', function($scope, $filter, ngTableParams) {
  var data = [{name: "Moroni", age: 50},
            {name: "Tiancum", age: 43},
            {name: "Jacob", age: 27},
            {name: "Nephi", age: 29},
            {name: "Enos", age: 34},
            {name: "Tiancum", age: 43},
            {name: "Jacob", age: 27},
            {name: "Nephi", age: 29},
            {name: "Enos", age: 34},
            {name: "Tiancum", age: 43},
            {name: "Jacob", age: 27},
            {name: "Nephi", age: 29},
            {name: "Enos", age: 34},
            {name: "Tiancum", age: 43},
            {name: "Jacob", age: 27},
            {name: "Nephi", age: 29},
            {name: "Enos", age: 34}];
$scope.tableParams = new ngTableParams({
    page: 1,            // show first page
    count: 10,          // count per page
    sorting: {
        name: 'asc'     // initial sorting
    }
}, {
    total: data.length, // length of data
    getData: function($defer, params) {
        // use build-in angular filter
        var orderedData = params.sorting() ?
                            $filter('orderBy')(data, params.orderBy()) :
                            data;
        $defer.resolve(orderedData.slice((params.page() - 1)
      * params.count(),       params.page() * params.count()));
    }
   });
 });
  app.controller('MyCtrl', ['$scope', function($scope) {
          $scope.modalShown = false;
          $scope.toggleModal = function() {
          alert(1);
            $scope.modalShown = !$scope.modalShown;
          };
        }]);

var-app=angular.module（'main'，['ngTable']）；
app.directive（'modalDialog'，function（）{
返回{
限制：'E'，
范围：{
显示：'='
},
replace:true，//替换为下面的模板
transclude:true，//我们要插入自定义内容
链接：函数（范围、元素、属性）{
scope.dialogStyle={}；
if（属性宽度）
scope.dialogStyle.width=attrs.width；
if（属性高度）
scope.dialogStyle.height=attrs.height；
scope.hideModal=函数（）{
scope.show=false；
};
},
模板：“
X
"
};
});
app.controller（'DemoCtrl'，函数（$scope，$filter，ngTableParams）{
变量数据=[{name:“Moroni”，年龄：50}，
{姓名：“Tiancum”，年龄：43}，
{姓名：“雅各布”，年龄：27}，
{姓名：“尼菲”，年龄：29}，
{姓名：“埃诺斯”，年龄：34}，
{姓名：“Tiancum”，年龄：43}，
{姓名：“雅各布”，年龄：27}，
{姓名：“尼菲”，年龄：29}，
{姓名：“埃诺斯”，年龄：34}，
{姓名：“Tiancum”，年龄：43}，
{姓名：“雅各布”，年龄：27}，
{姓名：“尼菲”，年龄：29}，
{姓名：“埃诺斯”，年龄：34}，
{姓名：“Tiancum”，年龄：43}，
{姓名：“雅各布”，年龄：27}，
{姓名：“尼菲”，年龄：29}，
{姓名：“埃诺斯”，年龄：34}]；
$scope.tableParams=新的ngTableParams({
第1页，//显示第一页
计数：10，//每页计数
分类：{
名称：“asc”//初始排序
}
}, {
总计：data.length，//数据长度
getData:函数（$defer，params）{
//使用内置角度过滤器
var orderedData=params.sorting（）？
$filter（'orderBy'）（数据，params.orderBy（））：
数据；
$defer.resolve（orderedData.slice（（params.page（）-1）
*params.count（），params.page（）*params.count（））；
}
});
});
app.controller（'MyCtrl'，['$scope'，函数（$scope）{
$scope.modalShown=false；
$scope.toggleModal=函数（）{
警报（1）；
$scope.modalShown=！$scope.modalShown；
};
}]);

请您至少看到警报了吗<代码>警报（1）你的代码…是的，我确实看到了警报。就像我运行程序的那一刻，我看到警报加上我刷新时弹出的内容，什么都不会出现。这里是：我可以解决问题。wid controller出现了问题。