文章/答案/技术大牛

发布

社区首页 >问答首页 >ngMaterial弹性布局不起作用

问ngMaterial弹性布局不起作用
EN

Stack Overflow用户

提问于 2015-11-23 00:47:40

回答 1查看 695关注 0票数 0

我似乎无法让ngMaterial排成一行，一个简单的hello world应用程序。我在控制台上没有看到任何错误，很明显我做的是错误的吗？我希望下面的布局，废话，水平。

<!DOCTYPE html>
<html>
  <head>
      <!-- AngularJS-ngMaterial-->
      <link src='//cdnjs.cloudflare.com/ajax/libs/angular-material/1.0.0-rc4/angular-material.css' />
      <link src='//cdnjs.cloudflare.com/ajax/libs/angular-material/1.0.0-rc4/angular-material.layouts.css' />
      <!-- /AngularJS-ngMaterial-->
  
  </head>
  <body ng-app='myApp' layout='column'>
      <md-toolbar>
        <h1>Angular Material - Starter</h1>
      </md-toolbar>
      
      <div layout='row'>
        <div flex>
          blag
        </div>
        <div flex>
          blah
        </div>
      </div>
  
      <!-- AngularJS-->
      <script src='//cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0-beta.2/angular.js'></script>
      <!-- /AngularJS-->
  
      <!-- AngularJS-ngAria-->
      <script src='//cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0-beta.2/angular-aria.js'></script>
      <!-- /AngularJS-ngAria-->
  
      <!-- AngularJS-ngAnimate-->
      <script src='//cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0-beta.2/angular-animate.js'></script>
      <!-- /AngularJS-ngAnimate-->
  
      <!-- AngularJS-ngMaterial-->
      <script src='//cdnjs.cloudflare.com/ajax/libs/angular-material/1.0.0-rc4/angular-material.js'></script>
      <!-- /AngularJS-ngMaterial-->
  
      <script type='text/javascript'>
          angular.module('myApp', ['ngMaterial']);
      </script>
  </body>
</html>

javascript

angularjs

flexbox

回答 1

Stack Overflow用户

回答已采纳

发布于 2015-11-23 01:33:34

如果在调试窗口中运行控制台，您将看到以下错误：Uncaught ReferenceError: angular is not defined

所以我假设你们的进口有问题。

我将angular.module语句解压缩到外部app.js文件(不需要，但这样就没有混淆了)，并将css替换为angulars网站中的一个。下面是一个有用的例子：

<!DOCTYPE html>
<html>
<head>
  <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/angular_material/0.11.2/angular-material.min.css">
</head>
<body ng-app='myApp' layout='column'>
  <md-toolbar>
    <h1>Angular Material - Starter</h1>
  </md-toolbar>

  <div layout='row'>
    <div flex>
      blag
    </div>
    <div flex>
      blah
    </div>
  </div>
</body>

<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.11.2/angular-material.min.js"></script>
<script src="app.js"></script>

</html>

我使用的CDN来自：https://github.com/angular/material#cdn

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/33862147

复制

相似问题

问ngMaterial弹性布局不起作用
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问ngMaterial弹性布局不起作用EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问ngMaterial弹性布局不起作用
EN