将名称添加到使用md-datepicker从Angular材质生成的输入
，是指在使用Angular Material中的md-datepicker组件生成的输入框中添加一个名称。
md-datepicker是Angular Material库中的一个日期选择器组件，它提供了一个用户友好的界面，用于选择日期。在使用md-datepicker生成的输入框中，默认情况下是没有名称的，只有一个日期选择按钮。如果需要在输入框中添加一个名称，可以通过以下步骤实现：
- 在HTML模板中，找到使用md-datepicker生成的输入框的位置。
- 在输入框之前或之后添加一个<label>标签，用于显示名称。例如：
<label for="datepicker">选择日期：</label>
<md-datepicker id="datepicker"></md-datepicker>- 在<label>标签中设置合适的文本内容作为名称。
完成上述步骤后，就可以在使用md-datepicker生成的输入框中添加一个名称了。用户在界面上就能清楚地知道这个输入框是用于选择日期的。
关于md-datepicker的更多信息，你可以参考腾讯云的Angular Material文档，其中包含了md-datepicker的详细介绍、使用示例和相关API文档。文档链接如下：
相关·内容
0回答
我在我的项目中使用了Angular 2材质日期选择器。如何显示内联日期选择器？
参考-
请让我知道这是可以做的使用角度材料(md-datepicker)。
浏览 6提问于2017-06-19得票数 2
从角度材料的Material元素打开在错误的日历位置(例如在未来的一两个月)从默认日期，当查看Chrome。类似地，如果选中了“年份”视图，则从默认日期打开一年或两年。
这篇文章()反问这个问题，奇怪的是，它在Chrome中工作，但在其他浏览器中却被破坏了。对这一问题的答复表明，已为FireFox、IE和Safari修复了该问题。
在Chrome桌面和Android上都进行了测试，测试结果(坏的)是一样的。
下面是两个单独的代码库，显示了这个问题。
第二个链接的代码是：
<link rel="stylesheet" href="http://ajax.goog
浏览 0提问于2016-12-25得票数 2
回答已采纳
1回答
我使用的是角度4和材质2
我有一个带有按钮的输入，可以打开一个日期选择器
我使用flex-layout将按钮推到屏幕的右侧，如下所示：
<div fxFlex>
<span fxFlex></span>
<md-input-container>
<input mdInput placeholder="Search in Date" [mdDatepicker]="myDatepicker">
<button mdSuf
浏览 11提问于2017-08-07得票数 0
回答已采纳
在我的应用程序中，我使用了momemt类型的$scope变量。我使用Angular Materialjs中的md-datepicker来更改ng-model中的日期变量。 md-datepicker只适用于日期类型，我可以从moment转换为Date类型，但在通过md-datepicker $scope变量更改数据后，将类型从Moment更改为Date。 如何将result md-datepicker Date类型转换回moment类型？这是在使用moment的其他函数中使用它时所需要的。 <md-datepicker ng-model="momentfrom" md-
浏览 34提问于2019-04-19得票数 0
我用创建了一个表单，所有的表单输入都给出了值，但不是。如何解决这个问题。这是我的html表单- md-datepicker输入：
<md-datepicker
name="date"
ng-model="date"
md-placeholder="Departure"
md-min-date="minDate"
></md-datepicker>
这是我的javascript：
angular.module('myBookApp', ['ngMaterial', '
浏览 0提问于2018-09-30得票数 1
回答已采纳
我刚刚复制和粘贴了datePicker和输入的角度材料代码，但是我得到了datePicker的这个错误。
app.module
import {MaterialModule} from '@angular/material';
@NgModule({
imports: [
...
MaterialModule
]
<md-input-container>
<input mdInput placeholder="Rechercher" [(ngModel)]="filterHistorique">
</md-i
浏览 6提问于2017-06-16得票数 53
回答已采纳
1回答
在将Angular材质从版本1.1.1升级到1.1.4之后，md-chip不能像以前那样工作。
在条目中键入字符串，然后单击outside，焦点将返回到输入。
我不希望这种情况发生。
使用角度材质1.1.1：
使用角度材质1.1.4：
有人能帮帮我吗？
浏览 1提问于2017-06-22得票数 0
1回答
我在角材料版本1.1.1中使用日期选择器有一些问题，如果我更改为角材料1.1.0，日历就会工作，就像我在codepen：上所做的那样。
以下是我的HTML：
<md-content md-theme="infocargas" layout-padding>
<form name="newDeliveryForm">
<div layout-gt-xs="row">
<md-input-container class="md-block" fl
浏览 4提问于2016-12-15得票数 4
回答已采纳
我有一个控制器名为"CtrlABC"，其中有两种形式，即formA和formB。我想要访问一个$scoepe变量名称$$scoepe. var1在这两个表单中的值同时，我可以以第一种形式访问和更改var1值，但是当尝试以另一种形式进行更改或访问它时(如下所示)，则完全不更改或访问它。这是我的代码样本。
angular.module("MyApp").controller("test", ['$scope',function ($scope) {
$scope.StartDate;
$scope.generateChart=f
浏览 2提问于2016-12-10得票数 0
回答已采纳
我使用的是Angular 5的材质设计。我在matInput中发现了非常奇怪的显示问题，在编辑模式下文本(如g)部分隐藏。有趣的是，此行为也存在于Angular材质示例中，请参阅此处：
有什么帮助来解决这个问题吗？
在MacOS (Macbook Pro)上发现问题，并且可以在chrome和safari上重现。
浏览 7提问于2017-12-27得票数 1
在我的所有项目中，我都遇到了同样的问题，试图找出最好的方法是用我的视图和Firebase绑定时间戳(date)。我目前正在使用角材质的md-datepicker指令，但不幸的是，这个指令只支持日期对象，而且由于Firebase不接受日期对象，所以值总是为空。
在几个项目中，我在Firebase中存储以毫秒为单位的时代时间戳。是否有可能在Firebase和md-datepicker中使用划时代的时间戳进行适当的3路数据绑定？
谢谢!
浏览 5提问于2017-05-05得票数 0
回答已采纳
1回答
打开数据报警器手动角度
、、、
我无法打开一个角度的日期选择器。目标是获得一个日期范围，所以当我更改dateStart时，第二个日历应该会自动打开，但它不会打开。
我错过了什么？
固定
似乎是焦点开放指令的问题。
工作小提琴：
var app = angular.module('myApp', ['ngMaterial']);
app.controller('MyCtrl', ['$scope','$timeout', function MyCtrl ($scope,$timeout) {
$scope.dateFormat = '
浏览 1提问于2016-12-12得票数 0
2回答
我正在学习angularjs，并使用angularjs材料日期选择器组件进行日期控制，但它不起作用，我使用的代码与在material.angularjs.org中找到的相同，但我的控件没有显示请帮助。我的html页面是DatePicker.html：
<!DOCTYPE html>
<html ng-app="datepickerBasicUsage">
<head>
<title></title>
<link href="angular-materi
浏览 1提问于2015-09-15得票数 6
回答已采纳
我使用了两个来自@angular/material的日期选择器(第一个表示"FromDate“，第二个表示"ToDate”
我设法按照Angular Material团队在他们的网站上提供的说明来实现它，但我找不到一种方法：-单击输入字段时，日历应该会出现(而不仅仅是单击图标)-避免用户在输入字段中键入任何内容
对于第一个问题，他们的网站上没有任何关于这个用例的文章，我甚至尝试过使用focus属性，但没有成功。对于第二个问题，我找到的唯一方法是disable输入字段(但这对我来说不是一个解决方案)
下面是我的HTML中的内容：
<div class="input-
浏览 6提问于2017-07-04得票数 0
回答已采纳
6回答
更改物料角度4的日期拾取器的语言
、、、、
如何更改材料角度日期选择器的语言？我在文档中找不到Angular material 2。这是一个plunkr https://plnkr.co/edit/unzlijtsHf3CPW4oL7bl?p=preview <md-input-container>
<input mdInput [mdDatepicker]="picker" placeholder="Choose a date">
<button mdSuffix [mdDatepickerToggle]="picker"></butt
浏览 39提问于2017-08-17得票数 28
回答已采纳
如何将角度材质2日期选择器配置为在焦点时自动打开？我在的文档中没有找到任何东西。
当前的html是这样的：
<input [mdDatepicker]="myDatepicker" id="inputWeekEnding" name="inputWeekEnding" type="text" class="form-control" show-button-bar="false"
[(ngModel)]="weekEnding" [mdDatepickerFi
浏览 0提问于2017-08-25得票数 35
回答已采纳
使用angular2材料的人显然不想展示如何获取当前选定的date...selectedChanged返回最后的日期。
<md-input-container>
<input mdInput [mdDatepicker]="picker" placeholder="Choose a date" [(ngModel)]="wtf">
<button mdSuffix [mdDatepickerToggle]="picker"
浏览 1提问于2017-07-01得票数 3
我正在尝试添加材料设计到jhipster生成的网关。尽管它似乎在工作，但我在控制台上得到了这个警告；
Could not find Angular Material core theme. Most Material components may not work as expected. For more info refer to the theming guide: https://material.angular.io/guide/theming
Could not find HammerJS. Certain Angular Material components may not w
浏览 1提问于2017-07-04得票数 2
我有下面的md-datepicker，它选择一个日期：
如何从输入值中获取日期，以便在另一个控制器中使用？
这是md-datepicker的HTML：
<div class="text-center">
<md-datepicker id="sDay" md-min-date="availableMinDate" class="orientationBottom" ng-model="availableCalendar" md-date-filter="severalDay
浏览 3提问于2016-10-25得票数 0
5回答
我有一个与集合中包含日期对象的数据库的mongoose连接。我想使用角材质的DatePicker控件来查看这些日期对象。Date对象遵循ISO字符串格式。
下面是一个代码片段：
<md-datepicker
ng-model="license.expirationdate" md-placeholder="Enter date">
</md-datepicker>
我得到以下错误：
ng-model for md-datepicker必须是Date实例。
在研究时，我发现您可以使用过滤器来创建日期实例，但这对我不起作用
浏览 11提问于2015-12-14得票数 15
回答已采纳
材料数据报警器在angular4项目中不起作用。我做了所有的事情，如棱角官方文件中所示，但它仍然给出了一个错误。这是我的模块
import { MdTabsModule, MdProgressSpinnerModule, MdInputModule, MdDatepickerModule, MdNativeDateModule} from '@angular/material';
这是进口品
imports: [
BrowserModule,
HttpModule,
BrowserAnimationsModule,
MdTabsModule,
MdProgressSpinner
浏览 0提问于2017-08-31得票数 1
回答已采纳
2回答
我需要输入框中的日期选择器。搜索发现ngMaterial提供了类似的特性。
我做了所有所需的文件包含，但得到错误。
angular.js:68Uncaught错误：$injector:unpr未知提供程序：$$asyncCallbackProvider <- $$asyncCallback <- $animate <- $compile
在index.html中，我想显示出生日期字段的日期选择器。
<div class="row">
<div class="form-group"
浏览 3提问于2016-09-02得票数 0
回答已采纳
我学习使用材料设计数据从官方页面，我想绑定选择的数据到日期对象。
datepicker-概述-示例.Component.html：
<md-input-container>
<input mdInput [mdDatepicker]="picker" placeholder="Choose a date">
<button mdSuffix [mdDatepickerToggle]="picker"></button>
</md-input-container>
<md-
浏览 2提问于2017-07-18得票数 0
回答已采纳
我正在尝试使用angularJs实现一个自动完成的下拉式输入框。是的，在angular和jquery中都有很多解决方案。但问题是，对于我需要的东西来说，它们似乎是不必要的复杂。到目前为止，我用非常有限的代码在angular中开发了大部分逻辑，它缺少的是一个像样的下拉输入框外观。
我有一个简单的指令：
app.directive('autoCompleteBox', function() {
return { restrict: 'E',
templateUrl: '/pathTo/auto-complete-inputbox.html&
浏览 0提问于2016-03-04得票数 0
1回答
我想知道为什么我的md-datepicker没有出现。我在部分html中有这段html代码。
<div ng-if="question.QuestionTypeId == 4" class="row text-left options" style="">
<md-datepicker ng-model="foo" md-placeholder="Enter date" ng-change="Test(question)"></md-datepicker>
浏览 0提问于2016-05-23得票数 1
我无法在app.module.shared文件中导入@angular/animations：
当我在app.module.browser文件中导入@angular/animations时，动画不起作用。
在angular asp.net Core2模板中使用材质动画需要做什么？
浏览 1提问于2017-09-26得票数 1
1回答
我正在创建一个应用程序使用角度js材料。我已经适当地包括日期选择，但无法添加垫单选按钮，我不知道为什么它没有显示。
这是我的HTML页面
<!doctype html>
<html ng-app="datepickerBasicUsage">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular.js"></script>
<script src="https:
浏览 0提问于2018-07-11得票数 2
回答已采纳
我在我的项目中使用了angular4。如何在输入框中设置选定日期的格式，如“2017年5月29日”。目前显示为29/05/2017
样本代码：
<md-input-container>
<input mdInput readonly="true" [mdDatepicker]="startDatePicker" [mdDatepickerFilter]="myFilter" [min]="minDate" [max]="maxDate" class="date-text ng-dirt
浏览 6提问于2017-05-29得票数 5
我想打开日历，其中用户选择日期从日期选择，不仅当用户点击日历图标，而且当点击输入字段。。因此，我为此创建了指令，将其附加到<md-datepicker>，并在输入中监视(click)事件：
Html：
<md-form-field class="field-half-width">
<input mdInput [mdDatepicker]="picker2" placeholder="Galioja iki"
formControlName="dateUntil"
浏览 3提问于2017-09-21得票数 18
回答已采纳
问题陈述:我正在实现Angular材质的mat-form-field属性。我将表单域外观作为轮廓。当选择输入时，我正在尝试更改输入边框的颜色。
预期行为。选择输入时，输入字段的轮廓边框颜色应该会更改。当表单域处于活动状态时，我想将轮廓的颜色更改为黑色。
当前行为:现在，当表单域处于活动状态时，它会显示角度材质的默认原色。
这些都是我的依赖
{
"dependencies": {
"@angular/animations": "^6.1.9",
"@angular/cdk": "^6.4.7&#
浏览 0提问于2018-10-15得票数 3
1回答
我刚接触angular material：
我想要显示用于编辑表中记录的对话框：
我引用了angular材质和angular aria，使用了ngMaterial依赖和$mdDialog服务。我有一个包含所有编辑字段的div，div visibility设置为hidden
<div style="visibility: hidden">
<div class="md-dialog-container" id="taskEdit">
<md-dialog style="width:100
浏览 4提问于2017-03-11得票数 1
回答已采纳
2回答
我在我的angular 10项目中使用了angular材质10.2.5。我通过添加下面这一行来包含主题
@import '@angular/material/prebuilt-themes/deeppurple-amber.css';
在我的style.css中，我创建了一个组件，并使用了一个原色的材质按钮，但我的按钮颜色并未应用。
<button mat-button color="primary">Toogle</button>
按钮颜色必须为蓝色
有什么想法吗？
浏览 0提问于2020-10-27得票数 0
1回答
我正在做我在Angular世界中的第一步，我参与了一个项目，该项目需要从sidenav元素的不同模块上的按钮切换侧边导航元素。特别是，我在UI中使用了Angular材质，而我当前正在使用的sidenav元素是mat-sidenav。
问题是，从必须切换的sidenav的不同模块上的组件截获此单击事件的好方法是什么？
浏览 11提问于2018-02-15得票数 0
回答已采纳
当打开材质菜单时，材质为8的Angular 8应用程序在IE11上抛出以下错误： Unable to get property 'opacity' of undefined or null reference 它在angular 7.2上工作得很好。使用的IE11版本: 11.1146.16299.0更新版本: 11.0.125 新的项目依赖版本： "dependencies": {
"@angular/animations": "^8.0.0",
"@angular/cdk": "^8.0.0"
浏览 42提问于2019-06-04得票数 2
如果用户选择的截止日期早于所选的起始日期和相反日期，我会尝试在日期选择器旁边显示一条错误消息。此消息应仅在用户单击submit按钮后显示。
代码：
<form name="form" ng-submit="ctrl.submit(form.$valid)" novalidate>
<div class="form-group">
<md-datepicker name="fromDate" ng-model="ctrl.fromDate"
浏览 0提问于2017-03-23得票数 0
我正在尝试使用棱角材料数据选择器，并得到以下错误：
TypeError: date.toLocaleDateString is not a function
at Object.defaultFormatDate [as formatDate] (angular-material.js:6860)
at DatePickerCtrl.configureNgModel.ngModelCtrl.$render (angular-material.js:7184)
at Object.<anonymous> (angular.js:25233)
at m.a.$get.m.$digest
浏览 2提问于2015-09-09得票数 4
回答已采纳
5回答
我想把angular-material添加到我的nx-workspace中。
angular material文档()说我应该运行ng add @angular/material。
我已经在我的nx工作区的根目录中，以及我想要添加它的应用程序文件夹和我想要添加它的lib项目文件夹中尝试过。在所有情况下，我都会收到消息The add command requires to be run in an Angular project, but a project definition could not be found.
Angular Material文档曾经包含如何手动添加依赖项的说明，但我现
浏览 4提问于2021-03-06得票数 6
1回答
我想使用角材质，但是在导入角材质主题css文件时，我要面对这个问题-我在<link href="../node_modules/@angular/material/prebuilt-themes/indigo-pink.css" rel="stylesheet">中导入了index.html，但是我有这个错误=>。
获取以下错误- 'http://localhost:8081/node_modules/@angular/material/prebuilt-themes/indigo-pink.css' because its
浏览 0提问于2018-07-25得票数 1
我有一个AngulaarJS应用程序，用户可以在其中选择他们想要查看的日期，它会在日历上打印这一天和接下来的30天。预期的功能需要是这样的，当用户从日历中更改日期时，它需要显示该日期，然后显示接下来的30天。
我的应用程序显示今天、日期和未来30天，但是当我在日期选择器上更改日期时，它不会更新日历。
我使用的是角度材质日期选择器：
<md-datepicker md-placeholder="Enter date" ng-model="myDate" ng-change="date_generator()" md-open-on-focus
浏览 31提问于2017-02-27得票数 2
回答已采纳
1回答
我正在用angularjs材料构建一个CRUD应用程序。因此，当我想要添加一个新用户时，生日输入必须是一个<md-datepicker>标记。
<md-datepicker ng-model="add.user.BirthDate" md-placeholder="Enter date"></md-datepicker>
这是HTML标记。
但是，当我想编辑用户时，会出现一个错误，即模型必须是日期。
<md-datepicker ng-model="edit.user.BirthDate" md-plac
浏览 0提问于2018-09-21得票数 0
回答已采纳
4回答
我有这样的东西：
如何使"Date of recruitment“和"down array”下面的行适应布局的一半，例如在flex="50“中。对于普通的输入域来说，这非常简单。
当前标记：
<md-content layout-padding>
<form>
<div layout-gt-xs="row">
<md-input-container class="md-block" flex-gt-xs>
<label> date <
浏览 0提问于2016-09-13得票数 6
我需要一个可重用的mat-chip-list输入，它知道以下内容:可以在输入中键入任何内容，但只能将有效的电子邮件地址添加到芯片列表中。如果输入中包含无效的电子邮件，并且用户按下ENTER、COMMA或TAB，则无法将输入值添加到列表中，并且mat-form-field将出现错误。
我有一个可用的示例，但它不能作为mat-form-field的输入重用，每次我想使用它时，我都需要复制粘贴它:(
我对如何解决这个问题持开放态度，我试图从自定义输入中调用mat-form-field中的错误(我知道这并不好)，我试图为mat-form-field创建一个特殊的验证器，但也失败了。
我使用的是Angu
浏览 8提问于2021-03-10得票数 2
5回答
角材料分页器不工作
、、、、
我正试图在我的应用程序中添加棱角材质分页器。
MatPaginatorModule添加了模块。
<mat-paginator #paginator
[length]="100"
[pageSize]="10"
[pageSizeOptions]="[5, 10, 25, 100]">
</mat-paginator>
但它给出了一个错误：
未知错误:模板解析错误：
不能绑定到‘长度’，因为它不是一个已知的属性‘垫-分页器’。
浏览 8提问于2017-12-12得票数 36
我使用角度材料，在安装后我得到了这个错误。我的package.json。我使用的是angular 8，并尝试更改为angular材质的版本。
"dependencies": {
"@angular/animations": "~8.2.9",
"@angular/cdk": "^8.2.3",
"@angular/common": "~8.2.9",
"@angular/compiler": "~8.2.9",
浏览 0提问于2020-10-22得票数 2
对不起我的英语。我有md-挑选日期的人有亲戚关系。当我在第一次减少日期，第二次改变3个月以上的第一次，而森康德md-min-日期变化与第一个模型。请参阅代码以更好地理解。
我的问题是：
当我更改第一个日期少于3个月时，第二个日期的最小日期出现错误。
我试图更改以下功能的min日期绑定：
<form name="myOtherForm" flex layout="row" layout-align="center center">
<md-input-container>
<label>
浏览 1提问于2017-01-26得票数 0
回答已采纳
我有一个包含“开始日期”和“持续时间”字段的AngularJS表单，我需要根据用户输入到这两个字段的内容来计算“结束日期”，即结束日期=开始日期+天数。
但我很难将它们转换成正确的数字格式，以正确计算“结束日期”。
以下是基本代码: HTML
<div ng-controller="MyCtrl">
<p>Start Date: <md-datepicker ng-model="date" md-placeholder="Enter date" >
</md-datepicker></
浏览 1提问于2017-10-18得票数 0
回答已采纳
我在angular js ng-material.I中使用md-date选择器。我想显示基于起始日期的截止日期。(Eg.If正在选择2018年8月27日，在起始日期列中，然后我必须在2018年8月27日之前禁用起始日期列中的截止日期picker.Here正在禁用起始日期列中的过去日期使用md- vm.min - date =“vm.minDate”为此vm.min日期我在控制器中编写代码
<md-datepicker
ng-model="field.start_date"
md-min-date="vm.minDate"
md
浏览 2提问于2017-08-26得票数 0
2回答
我试着使用日期选择器。我对复选框或单选按钮没有异议。但是，当我尝试添加日期选择器时，我总是会得到以下错误：
错误:模板解析错误:无法绑定到“htmlFor”，因为它不是“md-datepicker-toggle”的已知属性
在我的app.module.ts文件中：
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { MdButtonModule,
MdCheckboxModule
浏览 4提问于2017-09-12得票数 4
回答已采纳
3回答
我正在尝试使用material.angular.io创建datepicker，但我需要为字段设置默认日期。在以前的版本中，这是很容易的。有人知道我现在怎么做吗？
我的代码：
<input mdInput
name="start_time"
#start_time="ngModel"
[mdDatepicker]="startDate"
[min]="minDate"
date="true"
[(ngModel)]="p
浏览 0提问于2017-09-20得票数 8
回答已采纳
1回答
我在自定义库中包含角度材质依赖时遇到了问题。包含自定义库引用的主应用程序在构建应用程序时会抛出错误“找不到@angular/material/core”和"@angular/material/tabs“。但是这些依赖项存在于库的node_modules中。
我在网上读到将以下内容添加到库的package.json中
"dependencies": {
"@angular/animations": "^8.2.14",
"@angular/cdk": "^8.2.3",
"@a
浏览 1提问于2019-12-04得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
腾讯会议活动推荐
腾讯云开发者
