角度指令:指向第二个元素

Angular Directive: Point to second element

本文关键字:第二个 元素 指令      更新时间:2023-09-26

我想引用指令中的第二个元素。

从本质上讲,我想根据虚拟div的高度来调整文本框的大小。

<textarea vertical-align="dummyDiv"></textarea>
<div class="dummyDiv"></div>

在指令中,如何访问dummyDiv元素的属性?

下面是一个快速示例,说明了在指令之外访问另一个元素的方法。

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

<textarea vertical-align secondary-elem="'dummyDiv'" ng-model="someScopeValue"></textarea>
<div class="dummyDiv"></div>
<script>
    angular.module('myApp', [])
        .controller('myController', function($scope) {
            $scope.someScopeValue = 'Sample Text';
        })
        .directive('verticalAlign', function($parse) {
            return {
                scope: {
                    secondaryElem: '='
                },
                require: '^ngModel',
                link: function(scope, elm, attrs, ngModelCtrl) {
                    var otherElem = angular.element('.' + scope.secondaryElem);
                    function process(inputValue) {
                        otherElem.text(inputValue);
                    }
                    ngModelCtrl.$parsers.push(process);
                    console.log(otherElem);
                }
            };
        });
</script>