问题比较特殊，google了好久才得到启示
开发的angular页面，需要嵌入到客户的web页中，以iframe方式。由于iframe的高度需要指定，而angular动态生成机制导致页面高度会随时变化，
就会出现2个滚动条，一个是页面本身，一个是iframe里的。
解决方法如下：
1.写一个directive监听angular的$digest，实时获取body高度，通过 HTML5 postMessage方式传出
在HTML5中新增了postMessage方法，postMessage可以实现跨文档消息传输（Cross Document Messaging），Internet Explorer 8, Firefox 3, Opera 9, Chrome 3和 Safari 4都支持postMessage。该方法可以通过绑定window的message事件来监听发送跨文档消息传输内容。
module.directive('ngAppFrame', function () { return { restrict: 'EA', link: function (scope, element, attrs) { element.css("display", "block"); scope.$watch( function () { return element[0].offsetHeight; }, function (newHeight, oldHeight) { if (newHeight != oldHeight) { setTimeout(function () { var height = attrs.minheight ? newHeight + parseInt(attrs.minheight) : newHeight; var message = height; window.parent.postMessage(message, "*"); }, 0);// timeout needed to wait for DOM to update } } ); } } });
页面加入该directive
<div class="container-fluid " ui-view ng-app-frame></div>
2.iframe 父窗口监听message，获取iframe传出的动态高度并设定
<script> window.addEventListener("message", receiveMessage, false); function receiveMessage(event) { var iframe = document.getElementById("win"); iframe.height = event.data; } </script> <body> <div class="axaHeaderbg"></div> <div class="axa_inner_b2c"> <iframe src="../../whatever" id="win" width="100%" height="100%" scrolling="no" frameborder="0" marginwidth="0" marginheight="0"></iframe> </div> <div class="axaFooterbg"></div> </body>