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>
자바 스크립트
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
나는 각 아주 새로운 오전. 모든 실제 사례는 크게 감사하겠습니다.