下面是使用自定义对话框的例子 - CodePen
标记
<div ng-controller="MyController as vm" ng-cloak="" ng-app="app">
<md-button class="md-primary md-raised" ng-click="vm.open($event)">
Custom Dialog
</md-button>
<div ng-if="vm.showText" layout="column">
{{vm.placeholder1}}
<br>
{{vm.placeholder2}}
</div>
<script type="text/ng-template" id="test.html">
<md-dialog aria-label="Test">
<div layout-padding layout="column">
<md-input-container>
<label>Placeholder 1</label>
<input ng-model="vm.placeholder1">
</md-input-container>
<md-input-container>
<label>Placeholder 2</label>
<input ng-model="vm.placeholder2">
</md-input-container>
<md-button ng-click="vm.save()" class="md-primary">Save</md-button>
</div>
</md-dialog>
</script>
</div>
JS
angular.module('app',['ngMaterial'])
.controller('MyController', function($scope, $mdDialog) {
this.open = function(ev) {
this.showText = false;
$mdDialog.show(
{
templateUrl: "test.html",
clickOutsideToClose: true,
scope: $scope,
preserveScope: true,
controller: function($scope) {
},
});
};
this.save = function() {
this.showText = true;
$mdDialog.cancel();
}
})
演示:
https://material.angularjs.org/latest/demo/input
文档:
https://material.angularjs.org/latest/api/directive/mdDialog https://material.angularjs.org/latest/api/service/$mdDialog
你将不得不使用一个自定义对话框。 –
谢谢。我正在使用自定义对话框。你能指点我正确的方向/教程/例子吗? – user6934713