角材料 - 如何開始？

我有尖角的材料測試代碼：角材料 - 如何開始？

<div class="radioButtondemoBasicUsage" ng-app="MyApp"> 
    <form ng-submit="submit()" ng-controller="AppCtrl"> 
    <p>Selected Value: <span class="radioValue">{{ data.group1 }}</span> </p> 

    <md-radio-group ng-model="data.group1"> 

     <md-radio-button value="Apple" class="md-primary">Apple</md-radio-button> 
     <md-radio-button value="Banana"> Banana </md-radio-button> 
     <md-radio-button value="Mango">Mango</md-radio-button> 

    </md-radio-group> 

    <hr> 

    <p>Selected Value: <span class="radioValue">{{ data.group2 }}</span></p> 

    <md-radio-group ng-model="data.group2" class="md-primary"> 

     <md-radio-button ng-repeat="d in radioData" ng-value="d.value" ng-disabled=" d.isDisabled " ng-class="{'md-align-top-left': $index==1}"> 
      {{ d.label }}<br> 
      <span class="ipsum" ng-if="$index == 1"> 
      Duis placerat lectus et justo mollis, nec sodales orci congue. Vestibulum semper non urna ac suscipit. 
      Vestibulum tempor, ligula id laoreet hendrerit, massa augue iaculis magna, 
      sit amet dapibus tortor ligula non nibh. 
      </span> 

     </md-radio-button> 

    </md-radio-group> 

    <p> 
     <md-button class="md-raised" ng-click="addItem()" type="button">Add</md-button> 
     <md-button class="md-raised" ng-click="removeItem()" type="button">Remove</md-button> 
    </p> 

    <hr> 

    <p style="margin-bottom: 0;">Graphic radio buttons need to be labeled with the <code>aria-label</code> attribute.</p> 
    <p style="margin-top: 0;">Selected Avatar: <span class="radioValue">{{ data.group3 }}</span></p> 

    <md-radio-group ng-model="data.group3"> 
     <md-radio-button ng-repeat="it in avatarData" ng-value="it.value" aria-label="{{it.title}}"> 
      <md-icon md-svg-icon="{{it.id}}"></md-icon> 
     </md-radio-button> 
    </md-radio-group> 
    </form> 
</div>

https://material.angularjs.org/0.11.1/#/demo/material.components.radioButton

它的正常工作從codepen，但我得到的錯誤，當我嘗試在本地打開。

我試圖安裝角或把鏈接的js從CDN/CSS，但它不工作:(

銻能幫幫我嗎？

來源

2015-09-30 Dariusz Rup

有什麼錯誤？ – Daemedeor

我的意思是你至少把所有的代碼放入？並在頂部 – Daemedeor

你可能忘了加上HTML/body標籤和腳本。嘗試localy添加此，它應該工作。

http://codepen.io/anon/pen/PPWKWy

HTML

<html lang="en" ng-app="StarterApp"> 
     <head> 
     <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/angular_material/0.9.4/angular-material.min.css"> 
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=RobotoDraft:300,400,500,700,400italic"> 
     <meta name="viewport" content="initial-scale=1" /> 
     </head> 
     <body layout="column" ng-controller="AppCtrl"> 

    <!-- Content --> 

     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script> 
     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-animate.min.js"></script> 
     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-aria.min.js"></script> 

     <script src="https://ajax.googleapis.com/ajax/libs/angular_material/0.9.4/angular-material.min.js"></script> 
     </body> 
    </html>

var app = angular.module('StarterApp', ['ngMaterial']); 

app.controller('AppCtrl', ['$scope', '$mdSidenav', function($scope, $mdSidenav){ 
    $scope.toggleSidenav = function(menuId) { 
    $mdSidenav(menuId).toggle(); 
    }; 

}]);

編輯：如果是這樣的問題，你真的想學習AngularJS，試圖找到一個課程上https://www.udemy.com/ 他們往往放棄偉大的課程是免費的。

來源

2015-09-30 10:48:04

角腳本的代碼doestn工作:(我嘗試下載zip並啓動：選定值：{{data.group1}} 蘋果香蕉芒果奇怪 –

，它爲我工作，你有沒有解壓縮文件從codepen下載壓縮文件打開壓縮文件 - 創建一個新文件夾 - 將所有文件拖到該文件夾 - 用瀏覽器打開索引 –

咋工作對於解壓縮，對不起我的失敗:( –

角材料 - 如何開始？

回答

相關問題