Question

当我尝试使用angularstrap工具提示时，每次加载项目时都会导致此错误：

<span data-title="{{item.id}}" bs-tooltip delay="500"> </span>

在控制台中出现错误：

widgets.js:40761 TypeError: Cannot read property 'toLowerCase' of undefined
at TooltipFactory (http://localhost:9000/grunt-scripts/widget.js:66317:43)

有没有人有这方面的经验，请帮帮我？

“EDITED”：这是角度工具提示的代码：

angular.module('mgcrea.ngStrap.tooltip', ['mgcrea.ngStrap.helpers.dimensions'])

  .provider('$tooltip', function() {

    var defaults = this.defaults = {
      animation: 'am-fade',
      customClass: '',
      prefixClass: 'tooltip',
      prefixEvent: 'tooltip',
      container: false,
      target: false,
      placement: 'top',
      template: 'tooltip/tooltip.tpl.html',
      contentTemplate: false,
      trigger: 'hover focus',
      keyboard: false,
      html: false,
      show: false,
      title: '',
      type: '',
      delay: 0,
      autoClose: false,
      bsEnabled: true
    };

    this.$get = ["$window", "$rootScope", "$compile", "$q", "$templateCache", "$http", "$animate", "$sce", "dimensions", "$$rAF", "$timeout", function($window, $rootScope, $compile, $q, $templateCache, $http, $animate, $sce, dimensions, $$rAF, $timeout) {

      var trim = String.prototype.trim;
      var isTouch = 'createTouch' in $window.document;
      var htmlReplaceRegExp = /ng-bind="/ig;
      var $body = angular.element($window.document);

      function TooltipFactory(element, config) {

        var $tooltip = {};

        // Common vars
        var nodeName = element[0].nodeName.toLowerCase();
        var options = $tooltip.$options = angular.extend({}, defaults, config);
        $tooltip.$promise = fetchTemplate(options.template);
        var scope = $tooltip.$scope = options.scope && options.scope.$new() || $rootScope.$new();
        if(options.delay && angular.isString(options.delay)) {
          var split = options.delay.split(',').map(parseFloat);
          options.delay = split.length > 1 ? {show: split[0], hide: split[1]} : split[0];
        }

        // store $id to identify the triggering element in events
        // give priority to options.id, otherwise, try to use
        // element id if defined
        $tooltip.$id = options.id || element.attr('id') || '';

这一行的问题：

var nodeName = element[0].nodeName.toLowerCase();

Answer 1

Cannot read property 'toLowerCase' of undefined表示您尝试在未定义的变量上运行属于String对象的方法（String.prototype.toLowerCase()）。

function TooltipFactory(element, config) {

    var $tooltip = {};

    // Common vars
    var nodeName = element[0].nodeName.toLowerCase();

这是有问题的代码，element[0].nodeName未定义，这意味着element[0]没有名为nodeName的属性。你可以通过打印元素对象来测试它

console.debug("element[0] = %o", element[0]);

如果element[0]是<span>元素，您只需使用title属性访问工具提示文本

angularstrap bs-tooltip导致错误：无法读取未定义

1 个答案: