[英]How to add angular-material into an existing plunker project?
我遵循的是角材料的自述文件 ,其中設置的最后一步是:
安裝完所有必需的資產后,將ngMaterial添加為應用程序的依賴項:
angular.module('myApp', ['ngMaterial']);
但是...一旦我添加了ngMaterial依賴項,我的plunker便停止運行角度表達式: “ plunker上的script.js” 。
如何在插件項目中使用角形材料? 還是我犯了一個菜鳥錯誤?
編輯: 我可以從瀏覽器中同時使用http和https檢索角度材料,但是如果我使用的是在線代碼沙箱...即:我不能使用stackoverflow片段使用角度材料
//I am using https...but following code does not work on stackoverflow angular.module("myapp",['ngMaterial']).controller("controller",function($scope){$scope.angularexpression="controller is running";});
<!DOCTYPE html> <html ng-app="myapp"> <head> <link data-require="angular-material@1.0.0" data-semver="1.0.0" rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/angular_material/1.0.0/angular-material.min.css" /> <script data-require="angular-material@1.0.0" data-semver="1.0.0" src="https://ajax.googleapis.com/ajax/libs/angular_material/1.0.0/angular-material.min.js"></script> <script data-require="angular-material@1.0.0" data-semver="1.0.0" src="https://code.angularjs.org/1.4.9/angular.min.js "></script> <script data-require="angular-material@1.0.0" data-semver="1.0.0" src="https://code.angularjs.org/1.4.9/angular-route.min.js "></script> <script data-require="angular-material@1.0.0" data-semver="1.0.0" src="https://code.angularjs.org/1.4.9/angular-messages.min.js "></script> <script data-require="angular-material@1.0.0" data-semver="1.0.0" src="https://code.angularjs.org/1.4.9/angular-animate.min.js"></script> <script data-require="angular-material@1.0.0" data-semver="1.0.0" src="https://code.angularjs.org/1.4.9/angular-aria.min.js"></script> </head> <body ng-controller="controller"> {{angularexpression}} </body> </html>
嗯...我從plunker下載zip文件並在本地對其進行調試后,此修復程序是:
而不是使用默認的plunker外部庫加載器,您需要將其替換為以下內容:
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/angular_material/1.0.0/angular-material.min.css" />
<script src="https://code.angularjs.org/1.4.9/angular.min.js "></script>
// order matters, plunker load material before angular, which will not work
<script src="http://ajax.googleapis.com/ajax/libs/angular_material/1.0.0/angular-material.min.js"></script>
<script src="https://code.angularjs.org/1.4.9/angular-route.min.js "></script>
<script src="https://code.angularjs.org/1.4.9/angular-messages.min.js "></script>
<script src="https://code.angularjs.org/1.4.9/angular-animate.min.js"></script>
<script src="https://code.angularjs.org/1.4.9/angular-aria.min.js"></script>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.