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

Question

我刚开始学习Angular，我遇到了指令问题。我想做的是使用AngularJS将一个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/

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

我敢肯定，对于我做错的事情，有一个非常简单的答案，如果能帮助我指明正确的方向，将不胜感激！

Answer 1

将'px'连接到高度。

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