2016-03-07 31 views
0

我正嘗試在使用ngmodal的angularjs中實現模態彈出窗口。代碼運行時,瀏覽器控制檯上沒有返回錯誤,但單擊模式時沒有任何反應。下面是我的嘗試和代碼ngDialog單擊時未顯示模式,瀏覽器控制檯上未顯示任何錯誤

index.html文件

<html ng-appp="myApp"> 
<head> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.min.js"> 
<script src="ngDialog.js"></script> 
<link src="ngDialog.css"></link> 
<script src="ngDialog.min.js"></script> 
<script src="app.js"></script> 
</head> 
<body> 

<div ng-controller="MyCtrl"> 

    <button ng-click="clickToOpen()">My Modal</button> 

    <script type="text/ng-template" id="templateId"> 

     <div id="target" ng-click="test()" ng-controller="tt"> 
      Click here 
     </div> 
    </script> 

</div> 

</body> 
</html> 

app.js文件

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

//myApp.directive('myDirective', function() {}); 
//myApp.factory('myService', function() {}); 

function MyCtrl($scope, ngDialog) { 

    $scope.clickToOpen = function() { 
     ngDialog.open({ template: 'templateId' }); 
    }; 

} 
function tt($scope) 
{ 
    $scope.test = function() 
    { 
     console.log("AaA"); 
    } 
} 

來源教程http://jsfiddle.net/mb6o4yd1/6/ 的請協助

回答

0

HTML頁面。 你沒有把NG-應用

<!DOCTYPE html> 
<html lang="en"> 
<head> 
<script src="Scripts/angular.js"></script> 
<script src="Scripts/ngDialog.js"></script> 
<script src="Scripts/app.js"></script> 
<link href="Content/ngDialog.css" rel="stylesheet" /> 
<link href="Content/ngDialog-theme-default.css" rel="stylesheet" /> 
<title></title> 
</head> 
<body> 
<div ng-app="myApp"> 
<div ng-controller="MyCtrl"> 
<button ng-click="clickToOpen()">My Modal</button> 
</div> 

<script type="text/ng-template" id="templateId"> 
<div ng-controller="tt" class="ngdialog-message"> 
    <button ng-click="test()">Click here </button> 
</div> 
</script> 
</div> 

這是你的app.js

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

myApp.controller('MyCtrl', function ($scope,ngDialog) { 
    $scope.clickToOpen = function() { 
     ngDialog.open({ 
      template: 'templateId' 
     }); 
    }; 
}); 
myApp.controller('tt', function ($scope) { 
    $scope.test = function() { 
     alert('It works'); 
    } 
}); 

讓我知道你仍然發現有什麼問題。(我已經添加ngDialog主題默認.css)

相關問題