在尝试打开底片时,得到“TypeError:undefined不是函数”

时间:2015-03-10 06:21:11

标签: javascript angularjs angular-material

嘿伙计们我完全按照演示页面显示的内容但是当我尝试打开底页时我仍然收到此错误。我正在使用angularjs 1.3.14,我也试过1.3.6。除此之外,我已经按照入门页面上的说明来包含Angular Material及其依赖项。

HTML(master.html这是主页面包含所有js和css库)

<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/angular_material/0.8.2/angular-material.min.css">
<div ng-controller="MasterCtrl">
<body>
<div class="bottom-sheet-demo inset" layout="column" layout-sm="row" layout-align="center">
    <md-button class="md-primary" ng-click="showGridBottomSheet($event)">
      Show as Grid
    </md-button>
  </div>
  <br/>
  <b layout="row" layout-align="center center" layout-margin>
    {{alert}}
  </b>
  <div ng-view=""></div>
</body>
</div>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular-animate.min.js"></script>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular-aria.min.js"></script>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular-route.min.js"></script>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular-cookies.min.js"></script>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular-sanitize.min.js"></script>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular-messages.min.js"></script>

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/angular_material/0.8.2/angular-material.js"></script>
<script type="text/javascript" src="/static/javascripts/app.js"></script>
<script type="text/javascript" src="/static/javascripts/controllers.js"></script>

app.js

var app = angular.module('app',['ngMaterial','ngRoute','ngSanitize','ngCookies','ngAnimate']).
 config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {
    $routeProvider.
      when('/', {
        templateUrl: '/static/views/main.html',
        controller: 'IndexCtrl'
      }).
      when('/signin',{
        templateUrl: '/static/views/signin.html',
        controller: 'SignInCtrl'
      }).
      when('/signup',{
        templateUrl: '/static/views/signup.html',
        controller: 'SignUpCtrl'
      }).
      otherwise({
        templateUrl: '/static/views/error.html'
      });
    $locationProvider.html5Mode({
      enabled: true,
      requireBase: false
    });

  }]);

controller.js

angular.module('app').controller('MasterCtrl', [
  '$http',
  '$scope',
  '$location',
  '$rootScope',
  '$timeout',
  '$mdBottomSheet',
  function ($http, $scope, $location, $rootScope, $timeout, $mdBottomSheet) {
      $scope.alert = '';
  $scope.showGridBottomSheet = function($event) {
    $scope.alert = '';
    $mdBottomSheet.show({
      templateUrl: 'bottom-sheet-grid-template.html',
      controller: 'GridBottomSheetCtrl',
      targetEvent: $event
    }).then(function(clickedItem) {
      $scope.alert = clickedItem.name + ' clicked!';
    });
  };
  }
]);
angular.module('app').controller('GridBottomSheetCtrl', [
  '$scope',
  '$mdBottomSheet',
  function ($scope,$mdBottomSheet) {
    $scope.items = [
    { name: 'Hangout', icon: 'hangout' },
    { name: 'Mail', icon: 'mail' },
    { name: 'Message', icon: 'message' },
    { name: 'Copy', icon: 'copy' },
    { name: 'Facebook', icon: 'facebook' },
    { name: 'Twitter', icon: 'twitter' },
  ];
  $scope.listItemClick = function($index) {
    var clickedItem = $scope.items[$index];
    $mdBottomSheet.hide(clickedItem);
  };
  }
]);

这是我得到的错误

enter image description here enter image description here

我在这里停留了几天我仍然无法弄明白我试图切换到非缩小版角度材料来调试它然而我没有运气而且我不明白为什么,任何人都可以你教我如何调试这类问题?感谢您的帮助

1 个答案:

答案 0 :(得分:0)

我被困在同一个问题上。 我暂时决定强制element[1]而不是element[0]。 在某些情况下,element[0]是文本元素,而不是dom元素。