0
我正在學習角度。我之前用jquery完成了這個。我想知道這是什麼角度的方式。也有可能將這個功能封裝在服務或指令中，以便可以與其他小部件一起使用。Angularjs：模態窗口與窗口的大小 - 角度的方式
HTML：
<!doctype html>
<html ng-app="plunker">
<head>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.8/angular.js"></script>
<script src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.10.0.js"></script>
<script src="example.js"></script>
<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div my-modal="{ data: 'test2'}">test2</div>
</body>
</html>
的JavaScript
angular.module('plunker', ['ui.bootstrap', 'myModal']);
angular.module("myModal", []).directive("myModal", function ($modal) {
"use strict";
return {
template: '<div ng-click="clickMe(rowData)" ng-transclude></div>',
replace: true,
transclude: true,
scope: {
rowData: '&myModal'
},
link: function (scope, element, attrs) {
scope.clickMe = function() {
$modal.open({
template: "<div style=\"overflow:auto\">Created By:" + scope.rowData().data + "</div>"
+ "<div class=\"modal-footer\">"
+ "<button class=\"btn btn-primary\" ng-click=\"ok()\">OK</button>"
+ "<button class=\"btn btn-warning\" ng-click=\"cancel()\">Cancel</button>"
+ "</div>",
controller: function ($scope, $modalInstance) {
$scope.ok = function() {
$modalInstance.close({ test: "test"});
};
$scope.cancel = function() {
$modalInstance.dismiss('cancel');
};
}
});
}
}
};
});
工作plunker：
http://plnkr.co/edit/yzxtWwZQdq94Tagdiswa?p=preview
我是很新的角度。任何工作示例將不勝感激。