0

やあ、角度の感触をつかもうとしていて、ちょっとした障害に遭遇しました。

次のようなコンテナ構造があります。

<div class="main-container" ng-view>
    <!-- The below divs are constantly being 
         reloaded based on the current URL and it's associated view -->
    <div class="left-col">
    </div>
    <div class="right-col">
    </div>
</div>

Angular を実装する前に、ウィンドウの高さを確認し、それに応じて左の列と右の列の div の高さを設定する単純なスクリプトを作成しました。

angular を使用すると、おそらくこれを行うためのより良い方法があり、その後、イベント関数をウィンドウ オブジェクトにアタッチします。基本的に、新しいビューがレンダリングされるたびに関数を起動したいのですが、次のようにすべての角度コントローラーで以下のコードを複製したくありません。

$scope.$on('$viewContentLoaded', setColumnHeight);

どんな助けでも大歓迎です。ありがとう！

4

3 に答える 3

2

DOM ツリーの最上部にルート「アプリケーション コントローラー」を配置することで、アプリでこの問題を解決しました。例えば：

<body ng-controller='applicationController'>
...
<div class="ng-view"></div>
...
</body>

applicationController は常にそこにあり、作成時にそのスコープにバインドを設定できます。

于 2013-01-10T05:03:40.307 に答える
1

そのイベントリスナーをルートスコープに置くのはどうですか:

$rootScope.$on('$viewContentLoaded', setColumnHeight);
于 2013-01-10T04:51:31.167 に答える
0

次のようなものを使用できます。

<div class="main-container" ng-view>
    {{ setColumnHeight() }}
    <!-- The below divs are constantly being 
         reloaded based on the current URL and it's associated view -->
    <div class="left-col">
    </div>
    <div class="right-col">
    </div>
</div>

レンダリングが行われるたびに高さをチェックしますが、これは少し過剰な処理のようです。

最良の方法は、いずれかの高さが変更されたときにのみ、両方の列の高さを更新することです。そのためにDOM Mutation Observersを使用できますが、まだすべてのブラウザで利用できるわけではありません。それが問題にならない場合は、Mutation-summary libを確認してください。

jQuery を使用している場合は、https ://github.com/jqui-dot-net/jQuery-mutate (例はこちら) も試すことができます。

于 2013-01-09T23:43:12.360 に答える