2

angularの新機能、stackoverflowの新機能。何日もこれを解決しようとしてきました。ここに私の問題があります:

ボックスのグループを中央に配置したい。

div のプロパティ (ID またはクラス名を使用) にアクセスして、ディレクティブで操作する方法はありますか?

私のhtmlでは、ng-repeatでdivを作成しています。divは表示されるボックスです。私は今のところ、html の div/ディレクティブのプロパティを見つけて操作するために使用しようとしているディレクティブを持っていますが、これを行うことができないようです。

私はよくグーグルで検索しましたが、同様の問題が見つかりましたが、私のコードでは何も機能していないようです。

ここにフィドルがあります： http://jsfiddle.net/3m87R/

app.directive('someBoxes', function()
{
    return function(scope, element, attrs)
    {
        element.css('border', '1px solid white');
        //element.css('width', '200px');

        var body = angular.element(document).find('.bookitem');
        console.log(body[0].offsetWidth);

        if(scope.$last)
        {
            //console.log("element name is: " + element.attr("class"));
            //console.log("element is: " + element);
            //console.log($(".bookitem").children("div").attr("class"));
            //console.log($('.container').children('div').attr('class'));
        }
    };
});

ご協力ありがとうございました。

4

2 に答える 2

1

その理由は、ng-repeat が DOM を変更するため、ディレクティブのコンパイル中に子要素を使用できないためです。したがって、子要素には $watch が必要です。

これにより、子要素が追加されたことをディレクティブに通知し、それらに対して操作を実行します。

$watch は、「comment:(type 8)」である nodeType をスキップする必要があります。

ここに作業フィドルがあります：http://jsfiddle.net/3m87R/3/

リンクの部分： 

 link: function ($scope, element, attrs, controller) {
                    $scope.$watch(element.children(),function(){
                    var children = element.children();
                    for(var i=0;i<children.length;i++){
                        if(children[i].nodeType !== 8){
                            angular.element(children[i]).css('background', 'orange');
                        }
                    }
                });
            }
于 2013-08-09T06:20:26.767 に答える
0

あなたは近いです！テストフィドルの1つでディレクティブを機能させることができました。見てください。

$(element).css('border', '1px solid red');
$(element).css('text-align', 'center');

あなたのディレクティブのサンプルがあるこのフィドルを参照してください。

jsフィドル

于 2013-08-09T06:08:01.573 に答える