用angular2 dart和angular2_material創建一個簡單的按鈕

Question

我用stagehand生成了一個angular2 dart應用，它按預期運行。現在我正在嘗試添加一個從angular2-material-design到頁面的簡單按鈕，但沒有成功。只顯示按鈕標籤 - 該按鈕未按預期擡起。下面是簡單的src

.dart

library angular2_app.app_component; 

import 'package:angular2/angular2.dart'; 

import 'package:angular2_material/src/components/button/button.dart'; 

@Component(selector: 'my-app', templateUrl: 'app_component.html') 
class AppComponent {} 

的.html

<h1>My First Angular 2 App</h1> 

<md-content> 
    <section layout = "row" 
      layout-sm = "column" 
      layout-align = "center center" 
      layout-wrap> 
    <md-button class = "md-raised">Button</md-button> 
    </section> 
</md-content> 

這裏凸起按鈕是沒見過。

任何幫助表示讚賞。

Answer 1

的組分的選擇是[md-button].not(a)（和一些變體），這意味着該元件需要具有md-button而不是該元件必須是<md-button>一個屬性。這樣，任何元素都可以通過添加此屬性成爲md-button。

更改標籤

<div md-button>Button</div> 

在模板中使用

或

<div md-raised-button>Button</div> 

或

<a md-raised-button>Button</a> 

還指示需要與組件註冊

@Component(
    selector: 'my-app') 
@View(
    templateUrl: 'app_component.html', 
    directives: const [MdButton]) 
class AppComponent {} 

Angular2材料組件目前並不打算用於AFAIK和高度實驗，但它當然是很好的實驗。