我正在使用 AngularJS Material 库,我正在尝试弹出一个提示对话框,让用户输入密码。
该对话框工作正常,但问题是文本字段不是“密码”类型,并且密码可见。
有什么方法可以使文本字段设置为密码类型吗? 或者唯一的方法是制作自定义对话框?
这是来自 AngularJS Material 网站的示例:
$scope.showPrompt = function(ev) {
// Appending dialog to document.body to cover sidenav in docs app
var confirm = $mdDialog.prompt()
.title('What would you name your dog?')
.textContent('Bowser is a common name.')
.placeholder('Dog name')
.ariaLabel('Dog name')
.initialValue('Buddy')
.targetEvent(ev)
.required(true)
.ok('Okay!')
.cancel('I\'m a cat person');
$mdDialog.show(confirm).then(function(result) {
$scope.status = 'You decided to name your dog ' + result + '.';
}, function() {
$scope.status = 'You didn\'t name your dog.';
});
};
https://material.angularjs.org/latest/demo/dialog
谢谢。
最佳答案
提示是一个预制对话框,您需要使用自定义对话框
$scope.showAdvanced = function()
{
$mdDialog.show({
controller: DialogController,
templateUrl: './html/dialog1.tmpl.html', //custom template to load on the dialog
parent: angular.element(document.body),
clickOutsideToClose:true,
fullscreen: $scope.customFullscreen // Only for -xs, -sm breakpoints.
})
.then(function(answer) {
$scope.status = 'You said the information was "' + answer + '".';
}, function() {
//close the dialog
});
};
对话框 Controller
function DialogController($scope, $mdDialog) {
$scope.hide = function() {
$mdDialog.hide();
};
$scope.cancel = function() {
$mdDialog.cancel();
};
$scope.answer = function(answer) {
$mdDialog.hide(answer);
}
} // dialog controller end
在模板内,您只需添加所需的代码
<md-input-container style="margin-top:50px">
<label style="border-color: white; color: white; text-align:left;">Contraseña</label>
<input type="password" name="pass" ng-model="pass" required md-no-asterisk >
<div ng-messages="ingresoForm.pass.$error">
<div ng-message="required">Este campo es requerido</div>
</div>
</md-input-container>
最后调用你的对话框
$scope.showAdvanced();
您可以在此处找到整个文档: https://material.angularjs.org/latest/demo/dialog
您好!
关于javascript - AngularJS Material 如何将文本字段设置为提示对话框的密码?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46094498/