Question

我刚刚开始学习Angular，我遇到了指令的问题。我想要做的是使用AngularJS将一个div的高度与另一个div的高度相匹配，并且在页面加载时进行更改，我想在一个非常简单的指令中实现这一点。这是我正在尝试的淡化版本：

HTML：

<div ng-app="myApp">
    <div class="timeline"></div>
    <div id="match"></div>
</div>

CSS：

#match {
    background-color:red;
    height:200px;
}
.timeline {
    background-color:yellow;
    height:40px;
    transition:all linear 0.1s;
}

JS：

var app = angular.module('myApp', []);

app.directive('timeline', function ($window) {

    return {
        restrict: 'C',
        link: function (scope, elem, attrs) {
            var height = document.getElementById("match").clientHeight;
            elem.css({
                'height': height
            });
        }
    };
});

这是小提琴： http://jsfiddle.net/5jgczuuo/2/

我不明白为什么页面加载时高度没有变化。我直接放在它上面的任何代码，例如控制台日志等，正在运行，据我所知，我的语法似乎是正确的。（我知道高度var更新为正确的整数，它只是css没有改变。即使我将css高度改为任何随机int也是如此）

我确信对于我做错的事情有一个非常简单的答案，任何有助于指出我正确方向的帮助都会非常感激！

Answer 1

将'px'连接到高度。

elem.css({
    'height': height + 'px'
});

更改角度指令中的css属性值

1 个答案: