我如何在视图中访问 ngDialog 数据 属性
How do i access ngDialog data property in view
我正在使用 ngDialog
。
我正在设置它的 data
属性 值。
Problem: I am not sure how can i access data value in my view.
这就是我设置的方式 ngDialog.openConfirm。 myName
有价值。
ngDialog.openConfirm({
template: '/dist/Shared/testDialog.html',
data: myName,
showClose: false
}).then(function() {
$window.location.reload();
});
这就是我尝试在视图中使用数据 属性 的方式。没用。
<h3 class="modal-title">Hello, {{ngDialog.data}}</h3>
请指教
您可以与您的 ngDialog
共享范围,如下例所示:
var app = angular.module('exampleDialog', ['ngDialog']);
app.controller('MainCtrl', function($scope, $rootScope, ngDialog, $timeout) {
$scope.data = {
myName: "Peter"
};
$scope.openDefault = function() {
ngDialog.openConfirm({
template: '/dist/Shared/testDialog.html',
scope: $scope,
showClose: false
});
};
});
<!doctype html>
<html ng-app="exampleDialog">
<head>
<meta charset="utf-8">
<title>ngDialog demo</title>
<script data-require="angular.js@1.4.x" src="https://code.angularjs.org/1.4.8/angular.js" data-semver="1.4.8"></script>
<link rel="icon" href="data:;base64,iVBORw0KGgo=">
<link rel="stylesheet" href="//rawgit.com/likeastore/ngDialog/master/css/ngDialog.css">
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,700,400italic' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="//rawgit.com/likeastore/ngDialog/master/css/ngDialog-theme-default.css">
<script src="//rawgit.com/likeastore/ngDialog/master/js/ngDialog.min.js"></script>
<script src="app.js"></script>
</head>
<body ng-controller="MainCtrl">
<button type="button" class="button button-primary" ng-click="openDefault()">Open Modal</button>
<!-- Templates -->
<script type="text/ng-template" id="/dist/Shared/testDialog.html">
<div class="ngdialog-message">
<h3>ngDialog Id: <code>{{ngDialogId}}</code></h3>
<label>
User name:
<input type="text" name="myName" ng-model="data.myName" required>
</label>
<p>myName: <code>{{data.myName}}</code></p>
</div>
<div class="ngdialog-buttons">
<button type="button" class="ngdialog-button ngdialog-button-secondary" ng-click="closeThisDialog()">Close</button>
</div>
</script>
<p>myName: <code>{{data.myName}}</code></p>
</body>
</html>
我正在使用 ngDialog
。
我正在设置它的 data
属性 值。
Problem: I am not sure how can i access data value in my view.
这就是我设置的方式 ngDialog.openConfirm。 myName
有价值。
ngDialog.openConfirm({
template: '/dist/Shared/testDialog.html',
data: myName,
showClose: false
}).then(function() {
$window.location.reload();
});
这就是我尝试在视图中使用数据 属性 的方式。没用。
<h3 class="modal-title">Hello, {{ngDialog.data}}</h3>
请指教
您可以与您的 ngDialog
共享范围,如下例所示:
var app = angular.module('exampleDialog', ['ngDialog']);
app.controller('MainCtrl', function($scope, $rootScope, ngDialog, $timeout) {
$scope.data = {
myName: "Peter"
};
$scope.openDefault = function() {
ngDialog.openConfirm({
template: '/dist/Shared/testDialog.html',
scope: $scope,
showClose: false
});
};
});
<!doctype html>
<html ng-app="exampleDialog">
<head>
<meta charset="utf-8">
<title>ngDialog demo</title>
<script data-require="angular.js@1.4.x" src="https://code.angularjs.org/1.4.8/angular.js" data-semver="1.4.8"></script>
<link rel="icon" href="data:;base64,iVBORw0KGgo=">
<link rel="stylesheet" href="//rawgit.com/likeastore/ngDialog/master/css/ngDialog.css">
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,700,400italic' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="//rawgit.com/likeastore/ngDialog/master/css/ngDialog-theme-default.css">
<script src="//rawgit.com/likeastore/ngDialog/master/js/ngDialog.min.js"></script>
<script src="app.js"></script>
</head>
<body ng-controller="MainCtrl">
<button type="button" class="button button-primary" ng-click="openDefault()">Open Modal</button>
<!-- Templates -->
<script type="text/ng-template" id="/dist/Shared/testDialog.html">
<div class="ngdialog-message">
<h3>ngDialog Id: <code>{{ngDialogId}}</code></h3>
<label>
User name:
<input type="text" name="myName" ng-model="data.myName" required>
</label>
<p>myName: <code>{{data.myName}}</code></p>
</div>
<div class="ngdialog-buttons">
<button type="button" class="ngdialog-button ngdialog-button-secondary" ng-click="closeThisDialog()">Close</button>
</div>
</script>
<p>myName: <code>{{data.myName}}</code></p>
</body>
</html>