角材料2：“ md-input”不是已知元素

Question

我在這里想念什么？ md-input是否應該單獨加載到module文件中？

這有效：

<md-input-container>
  <input mdInput name="username" placeholder="Username" [(ngModel)]="username" #name="ngModel" required>          
</md-input-container>

但是，這失敗了：

<md-input placeholder="amount" align="end">
  <span md-prefix>$&nbsp;</span>
  <span md-suffix>.00</span>
</md-input>

出現以下錯誤：

Unhandled Promise rejection: Template parse errors:
'md-input' is not a known element:
1. If 'md-input' is an Angular component, then verify that it is part of this module.
2. If 'md-input' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schemas' of this component to suppress this message. ("
  </div>
  <div>
    [ERROR ->]<md-input placeholder="amount" align="end">
      <span md-prefix>$&nbsp;</span>

app.module.ts

import { NgModule }      from '@angular/core';
import { CommonModule }   from "@angular/common";
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from "@angular/forms";
import { MaterialModule } from "@angular/material";

import { AppComponent }  from './app.component';

import "hammerjs";

@NgModule({
  imports:      [ 
    CommonModule,
    BrowserModule, 
    FormsModule,
    MaterialModule.forRoot() 
  ],
  declarations: [ AppComponent ],
  bootstrap:    [ AppComponent ]
})
export class AppModule { }

Answer 1

那是因為在您的第二個示例中，語法是錯誤的。 在最后一個2.0.0 beta .1（我想您正在使用）中， md-input關鍵字已替換為mdInput 。 因此，如果您需要使用Angular Material 2設置樣式的輸入，只需鍵入

<md-input-container>
    <input mdInput placeholder="Username" name="username">
 </md-input-container>

Answer 2

我認為您指定的前綴和后綴有誤。 根據https://material.angular.io/components/component/input

前綴和后綴

HTML可以在輸入標簽之前和之后包含前綴或后綴。 將根據材料規范在其下划線，然后單擊將使輸入集中。

在md-input-container內部的元素上添加mdPrefix屬性，將其指定為前綴。 同樣，添加mdSuffix將其指定為后綴。

而不是使用md-prefix和md-suffix ：

<md-input placeholder="amount" align="end">
  <span md-prefix>$&nbsp;</span>
  <span md-suffix>.00</span>
</md-input>

嘗試使用mdPrefix和mdSuffix並將其包裝在md-input-container ：

<md-input-container>
    <input mdInput placeholder="amount" align="end">
    <span mdPrefix>$&nbsp;</span>
    <span mdSuffix>.00</span>
</md-input-container>