如何在点击时获得angularjs中div的长度？

这真的很基本，但我不知道为什么我无法解决这个问题。如何在点击时获得angularjs中div的长度？

我试图得到一个div的长度，当我点击它，我试过不同的方式来做到这一点，但没有成功。

这里是我想要的一个例子：http://plnkr.co/edit/eGqu2HSUixr0S5CH3jNr?p=preview

如果有人可以解释如何是“角办法”要做到这一点会非常感激。 :)

2013-12-20 DreaMTT

this将参照scope，尝试通过$event.target，而是和因为你要调用html()与angular.element包裹。

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; 
    } 

    } 
});

来源

2013-12-20 08:57:06

如果你想知道DOM中的字符串，然后做这将是把功能在自定义指令的角路的长度。

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之前获取字符串的长度，而不是之后。

来源

2013-12-20 09:13:59

真的！不幸的是，我来自一个jQuery世界，用来做很多DOM操作。我正在努力改变我在使用Angular时的想法，因此任何改变我思维过程的最佳实践或建议都将受到高度赞赏。我刚创建了一个自定义电子邮件组件这个组件的功能与输入一样，我有义务处理这些操作，反正如果你能够以正确的角度来说明这一点，那就太棒了！你可以在这里查看这个组件：http://plnkr.co/edit/9TmCt2vWzdOgWtrBIkEZ?p=preview – DreaMTT

与原始问题并不完全相关，但此刻我认为选择了一个div with contenteditable =“true”过度复杂化，并且在确保用户不打破它的情况下（如果用户输入或在其中粘贴一些html，那该怎么办？），这将很难得到正确的结果。标准HTML在''上已具有'placeholder'属性，而''元素上的ng-model可以将其与范围上的值绑定。如果你需要一些自定义验证，那么你应该阅读[ngModelController]（http://docs.angularjs.org/api/ng.directive:ngModel.NgModelController） –

如何在点击时获得angularjs中div的长度？

回答

相关问题