0

私は基本的なウィジェットブロックを持っています:

<div class="matter ng-controller="ProductsCtrl">
    <div class="container-fluid">
        <div class="widget">
            <div class="widget-head">
              <div class="pull-left">Browse live products</div>
                    <div class="widget-icons pull-right">
                        <a class="wminimize" href="#" ng-click="showContent = !showContent"><i class="icon-chevron-up"></i></a> 
                    </div>  
                <div class="clearfix"></div>
            </div><!--widget-head-->

            <div class="widget-content" ng-class="{ 'hidden': !showContent }">
              <div class="padd">

                <div>
                    {{content}}
                </div>

              </div>
              <div class="widget-foot"></div>

            </div><!--widget-content-->
        </div><!--widget-->
    </div>
</div>

そして、ここに空のコントローラーがあります：

appAdmin.controller("ProductsCtrl", function($scope){

});

コンテンツの非表示/表示に ng-click を使用していますが、デフォルトでコンテンツを表示しようとしています。私はAngularに非常に慣れていないため、これらの単純な機能を機能させるためにモデルや物を追加する方向性を探しています。

どんな助けでも大歓迎です。

編集：に切り替えるng-class="{ 'hidden' : !showContent }"ことでデフォルトを表示ng-class="{ 'hidden' : showContent }"

4

1 に答える 1

1

コンテンツがデフォルトで表示されるようにする$scope.showContentには、コントローラーで true に設定します。次の方法で、ng-classの値に基づいてシェブロン アイコン クラスを変更するために使用できます。真の値のキーのみが適用されるため、 または のいずれかになります。あなたの質問を誤解した場合はお知らせください。showContent<i ng-class="{'icon-chevron-up': showContent, 'icon-chevron-down': !showContent}"></i>icon-chevron-upicon-chevron-down

于 2013-08-01T14:09:03.800 に答える