标签: angular-material

我希望我的按钮显示左右箭头和现在的文本尽可能小.我怎么做？

<div ng-controller="DateCtrl" layout="row" flex>
     <md-datepicker ng-model="activeDate" md-placeholder="Enter date" ng-change="changeDate()"></md-datepicker>
     <div>
         <md-button class="md-raised" ng-click="prev()">&lt;</md-button>
         <md-button class="md-raised" ng-click="changeToday()">NOW</md-button>
         <md-button class="md-raised" ng-click="next()">&gt;</md-button>
     </div>
</div>

使用当前的解决方案,按钮将被布置为好像它们在layout="column"垂直方向上.

在深入研究这种CSS风格之前,我只是想检查是否有一种首选的Angular-Material方式来做到这一点？

当我尝试测试角度分量时,我遇到以下错误:

运行jest测试时出错:

Can't bind to 'matMenuTriggerFor' since it isn't a known property of 'button'.

这是我的HTML:

<button mat-button [matMenuTriggerFor]="menu">Menu</button>
<mat-menu #menu="matMenu">
  <button mat-menu-item>Item 1</button>
  <button mat-menu-item>Item 2</button>
</mat-menu>`

我"@angular/material": "6.1.0",在我的package.json中使用.我也进口的所有必要的材料依赖于beforeAll块下TestBed 我也试着更改按钮的特性matMenuTriggerFor来mat-menu-trigger-for.它没用.

请建议我如何修复此测试.

我一直在经历间歇性超时,这是在Protractor常见问题解答中指责使用$ timeout进行轮询(AKA:waitForAngular超时).我不知道在没有投票的情况下它是否也会失败.对于我的团队来说,因为我们依赖于Angular Material组件,所以它更加轻松.他们在动画交互方面很重要,并且经常使用$ timeout(func,0).这个问题类似于问题#29966301,但侧重于Angular Material和Protractor之间可能存在的问题.我真的很想知道那些大量使用Angular Material和Protractor的人如果遇到这些问题就会处理这些问题.

有趣的是,我没有在Protractor和Angular Material github网站上看到过对彼此功能的任何利用.由于它们都是来自Google同一组的Angular库,@ juliemr和Protractor Gang可以与@ThomasBurleson和Material团队讨论,使用Protractor为Angular Material提供全面的用例和E2E测试以清除这些问题.

我想在另一个$mdDialog上面打开一个.如果可能,请使用无限重叠对话框.

有任何想法吗？

如果将md-sort-header添加到md-table中的md-header-cell中,则它始终是左对齐的.如何对标题单元格进行居中对齐,例如"名称"？

<md-header-cell *cdkHeaderCellDef md-sort-header style="text-align:center"> 
      Name 
</md-header-cell>

plnkr

是否有任何选项可以将Angular材质与新的Angular 4一起使用？

官方material.angularjs.org说:

Angular Material最近发布了第1版,我们认为它是稳定的,可以用于生产.开发人员应注意Angular Material v1仅适用于Angular 1.x.

关于Angular 2:

Angular Material v2开发也在angular/material2GitHub存储库中进行

Angular 4怎么样？你认为我们可以在一个项目中以某种方式绑定Angular 1.x和Angular 4来带来Angular 4的新功能并继续使用令人敬畏的Angular Material框架吗？

我想通过jquery更改materialize选择框值.

我使用$('#myselect').val('1');的onchange其他选择框的事件,但它不工作.

$("#select1").change(function() {
    $('#myselect').val('1');
});

我正在使用Angular Material 2创建一个带有选择列表(每个列表项的复选框)的工具栏.我无法弄清楚如何在列表显示之前设置复选框,然后在用户交互后获取所选项目.

我在一个Form中尝试控制,认为我可能需要这个绑定到ngModel,但这似乎没有帮助.到目前为止,我的HTML是:

<form
  novalidate
  #areaSelectForm="ngForm">

<div>
    <mat-selection-list 
                        #areasList="ngModel"
                        [(ngModel)]="model"
                        id="areaListControl"
                        name="areaListControl"
                        (ngModelChange)="onAreaListControlChanged($event)">
        <mat-list-option *ngFor="let tta of taskTypeAreas" (click)="onCheckboxClick($event)" [value]="tta">
            {{tta}}
        </mat-list-option>
    </mat-selection-list>
</div>

</form>

这必须是一个很好的路径,但文档很难解释,我似乎找不到任何合适的例子.

任何指导都非常欢迎.

角5 -

这是npm模块(package.json) -

   "@angular/animations": "^5.0.0",
    "@angular/cdk": "^5.0.0-rc.2",
    "@angular/common": "^5.0.0",
    "@angular/compiler": "^5.0.0",
    "@angular/core": "^5.0.0",
    "@angular/forms": "^5.0.0",
    "@angular/http": "^5.0.0",
    "@angular/material": "^5.0.0-rc.2",
    "@angular/platform-browser": "^5.0.0",
    "@angular/platform-browser-dynamic": "^5.0.0",
    "@angular/router": "^5.0.0",
    "core-js": "^2.4.1",
    "hammerjs": "^2.0.8",
    "rxjs": "^5.5.2",
    "zone.js": "^0.8.14"

我使用Angular材质Spinner作为Material模块的MatSpinner指令

import { MatSpinner } from "@angular/material";
@NgModule({
imports: [

MatSpinner
],
declarations: [],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }

这是HTML:

<mat-spinner></mat-spinner>

我得到一个错误 -

由模块'AppModule'导入的意外指令'MatSpinner'.请添加@NgModule注释.

我的Angular材料项目中有一个简单的选择表单字段:

component.html

  <mat-form-field>
    <mat-select [(value)]="modeSelect" placeholder="Mode">
      <mat-option value="domain">Domain</mat-option>
      <mat-option value="exact">Exact</mat-option>
    </mat-select>
  </mat-form-field>

当[(value)]="modeSelect"被绑定到modeSelect财产在component.ts文件

我想这样做,所以<mat-option value="domain">Domain</mat-option>在页面加载时默认选择.

ng-selected 不适合我