Angular Material布局演示不起作用

Question

I'm trying to just run the Angular Material grid layouts demo that can be found here titled Flex Percent Values. 我正在尝试运行“角度材料”网格布局演示，该演示可在此处找到，标题为“弹性百分比值”。

Excerpts from my HTML code is as follows: 我的HTML代码节选如下：

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="initial-scale=1" />
  <!-- LINK TO LOCAL BUT HOW? -->
  <link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/angular_material/1.0.0-rc4/angular-material.min.css">
  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,400italic">
  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
  <link rel="stylesheet" href="../../../bower_components/angular-material/modules/css/angular-material-layouts.css">
  <base href="/">
</head>
<body data-ng-app="MyApp" data-ng-controller="MainCtrl">
    <div layout="row" layout-wrap>
      <div flex="30">
        [flex="30"]
      </div>
      <div flex="45">
        [flex="45"]
      </div>
      <div flex="25">
        [flex="25"]
      </div>
      <div flex="33">
        [flex="33"]
      </div>
      <div flex="66">
        [flex="66"]
      </div>
      <div flex="50">
        [flex="50"]
      </div>
      <div flex>
        [flex]
      </div>
    </div>
    <div ng-view></div>
<!-- Angular Material Dependencies -->
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/angular-route/angular-route.js"></script>
<script src="bower_components/angular-animate/angular-animate.js"></script>
<script src="bower_components/angular-aria/angular-aria.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular-resource.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular-aria.min.js"></script>

<!-- Angular Material Javascript now available via Google CDN; version 0.11.2 used here -->
<script src="https://ajax.googleapis.com/ajax/libs/angular_material/0.11.2/angular-material.js"></script>

When I add Material Angular elements like md-button they render, although anything layout related doesn't work. 当我添加诸如md-button类的Material Angular元素时，它们会渲染，尽管与布局相关的任何内容均不起作用。 I've double checked that I'm importing all the stylesheets I need, and I think I am. 我已经仔细检查过我是否正在导入我需要的所有样式表，而且我想是的。 I'm not sure what's wrong though. 我不知道怎么了。

Answer 1

You're linking to the CSS stylesheet of the 1.0.0-rc4 version but you're loading the scripts of the 0.11.2 version... 您正在链接到1.0.0-rc4版本的CSS样式表，但是正在加载0.11.2版本的脚本...

I'm pretty sure that this is the problem! 我很确定这是问题所在！

Angular Material布局演示不起作用

问题描述

1 个解决方案

解决方案1
4 已采纳 2015-11-27 11:05:01

Angular Material布局演示不起作用

问题描述

1 个解决方案

解决方案1 4 已采纳 2015-11-27 11:05:01

解决方案1
4 已采纳 2015-11-27 11:05:01