material 设计中的输入没有主题
Inputs in material design are not themed
我有工作、按钮、购物车、列表,但我的输入与此处演示中的主题不同:https://material.angularjs.org/#/demo/material.components.input
现在简单的复制了demo的代码,还是不行。这是 html:
<div ng-controller="View1Ctrl" layout="column" md-theme="green">
<md-toolbar class="md-primary">
<h1 class="md-toolbar-tools">
Top Secret Project
</h1>
</md-toolbar>
<md-content class="md-padding">
<form name="projectForm">
<md-input-container>
<label>Description</label>
<input md-maxlength="30" required name="description" ng-model="project.description">
<div ng-messages="projectForm.description.$error">
<div ng-message="required">This is required.</div>
<div ng-message="md-maxlength">The name has to be less than 30 characters long.</div>
</div>
</md-input-container>
<md-input-container>
<label>Client Name</label>
<input required name="clientName" ng-model="project.clientName">
<div ng-messages="projectForm.clientName.$error">
<div ng-message="required">This is required.</div>
</div>
</md-input-container>
<md-input-container>
<label>Hourly Rate (USD)</label>
<input required type="number" step="any" name="rate" ng-model="project.rate" min="800" max="4999" required>
<div ng-messages="projectForm.rate.$error">
<div ng-message="required">You've got to charge something! You can't just <b>give away</b> a Missile Defense System.</div>
<div ng-message="min">You should charge at least 0 an hour. This job is a big deal... if you mess up, everyone dies!</div>
<div ng-message="max">,000 an hour? That's a little ridiculous. I doubt event Bill Clinton could afford that.</div>
</div>
</md-input-container>
</form>
</md-content>
</div>
和 js:
.controller('View1Ctrl', [function View1Controller() {
$scope.project = {
description: 'Nuclear Missile Defense System',
clientName: 'Bill Clinton',
rate: 500
};
}]);
结果:http://i.imgur.com/DKsfZEJ.png
我错过了什么?
我在 0.6 版中遇到了同样的问题
更新到主分支(当前为 0.7-rc3)确实解决了未以 material 样式显示的问题。
我没有搜索问题队列,但可能有 answer/bug 报告。
我有工作、按钮、购物车、列表,但我的输入与此处演示中的主题不同:https://material.angularjs.org/#/demo/material.components.input
现在简单的复制了demo的代码,还是不行。这是 html:
<div ng-controller="View1Ctrl" layout="column" md-theme="green">
<md-toolbar class="md-primary">
<h1 class="md-toolbar-tools">
Top Secret Project
</h1>
</md-toolbar>
<md-content class="md-padding">
<form name="projectForm">
<md-input-container>
<label>Description</label>
<input md-maxlength="30" required name="description" ng-model="project.description">
<div ng-messages="projectForm.description.$error">
<div ng-message="required">This is required.</div>
<div ng-message="md-maxlength">The name has to be less than 30 characters long.</div>
</div>
</md-input-container>
<md-input-container>
<label>Client Name</label>
<input required name="clientName" ng-model="project.clientName">
<div ng-messages="projectForm.clientName.$error">
<div ng-message="required">This is required.</div>
</div>
</md-input-container>
<md-input-container>
<label>Hourly Rate (USD)</label>
<input required type="number" step="any" name="rate" ng-model="project.rate" min="800" max="4999" required>
<div ng-messages="projectForm.rate.$error">
<div ng-message="required">You've got to charge something! You can't just <b>give away</b> a Missile Defense System.</div>
<div ng-message="min">You should charge at least 0 an hour. This job is a big deal... if you mess up, everyone dies!</div>
<div ng-message="max">,000 an hour? That's a little ridiculous. I doubt event Bill Clinton could afford that.</div>
</div>
</md-input-container>
</form>
</md-content>
</div>
和 js:
.controller('View1Ctrl', [function View1Controller() {
$scope.project = {
description: 'Nuclear Missile Defense System',
clientName: 'Bill Clinton',
rate: 500
};
}]);
结果:http://i.imgur.com/DKsfZEJ.png
我错过了什么?
我在 0.6 版中遇到了同样的问题
更新到主分支(当前为 0.7-rc3)确实解决了未以 material 样式显示的问题。
我没有搜索问题队列,但可能有 answer/bug 报告。