1
Ziemlich neu zu Angular und immer noch versucht, meinen Kopf um ein paar Dinge zu wickeln. Ich brauche die Höhe mehrerer Elemente auf einem Dashboard. Ich habe diese Antwort gesehen: Get HTML Element Height without JQuery in AngularJS Allerdings kann ich nicht herausfinden, wie es für mehrere Elemente arbeiten. Sicherlich muss ich keine separate Direktive für jedes Element schreiben. So spielen mit dieser Plunker, änderte ich die HTML nach unten, aber identische Werte für beide Elemente.Holen Sie Höhe für mehrere Elemente ohne JQuery in AngularJS
HMM
script.js:
angular.module('myModule', [])
.directive('myDirective', function($timeout) {
return {
restrict: 'A',
link: function(scope, element) {
scope.height = element.prop('offsetHeight');
scope.width = element.prop('offsetWidth');
}
};
})
;
und die HTML:
<!DOCTYPE html>
<html>
<head>
<script data-require="[email protected]*" data-semver="1.2.13" src="http://code.angularjs.org/1.2.13/angular.js"></script>
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>
</head>
<body ng-app="myModule">
<h1 my-directive>Hello Plunker! width: {{width}}, height: {{height}}
</h1>
<h3 my-directive>Smaller Hello Plunker! width: {{width}}, height: {{height}}
</h3>
</body>
</html>
Die Konsole gab mir verschiedene Höhen sein, wenn ich Ihren HTML-Code in die Plunker setzen. (37 & 22) – Adjit
Entschuldigung: mit dem falschen Plünderer verbunden: nur auf den richtigen bearbeitet. Ich versuche herauszufinden, warum die Bindungen identisch sind – Spleenboy
Ahh, ich sehe jetzt. Ja, wenn du die Dev-Tools öffnest, zeigt es die h1 und h3 genauso hoch an, also denke ich, dass der Fehler in deiner Direktiven-Einstellung liegt. Sie sollten diesen Code auch posten. – Adjit