Question

这是非常基本的，但我不知道为什么我无法解决这个问题。

当我点击它时，我正试图获得div的长度，我尝试了不同的方法，但没有成功。

以下是我想要的示例：http://plnkr.co/edit/eGqu2HSUixr0S5CH3jNr?p=preview

如果有人可以解释如何做到这一点的'角度方式'将非常感激。：）

Answer 1

this会引用scope，尝试传递$event.target，而且请使用angular.element进行换行，因为您要拨打html()。

http://plnkr.co/edit/ibBNM0wK4RDH2JnamfV9?p=preview

<div ng-click="getLength($event.target)">Click to know the length of this string</div>

app.controller('MainCtrl', function($scope, $parse) {
  $scope.getLength = function(obj) {
    var obj = angular.element(obj);
    try {
      $scope.output = (obj !== undefined) ? obj.html().length : 'undefined';
    } catch(err) {
      $scope.output = err.message;
    }

  }
});

Answer 2

如果您想知道DOM中字符串的长度，那么Angular的方法是将功能放在自定义指令中。

app.directive('sendLengthOnClick', function() {
  return {
    scope: {
      'localSendLength': '&sendLengthOnClick'
    },
    link: function(scope, iElement, iAttr) {
      iElement.on('click', function() {
        var length = iElement.text().length;
        scope.localSendLength({length:length});
      });
    }
  }
});

然后，您可以在任何元素上添加属性send-length-on-click，以将字符串长度发送到父作用域上的函数：

<div send-length-on-click="useLength(length)">Click to know the length of this string</div>

您可以在以下Plunker中看到这一点：

http://plnkr.co/edit/Zuk2wnndayvBgYyNXQaL?p=preview

但是，我很想知道你为什么喜欢这个。它感觉有点接近基于模型数据的计算，这在服务中更常见，在字符串到达DOM之前获取字符串的长度，而不是之后。

如何在click上获得angularjs中div的长度？

2 个答案: