angularjs找到指令DIV的性质 [英] angularjs find properties of div in directive

问题描述

新的角度，新的StackOverflow。一直在努力解决这个好几天。这里是我的问题：

new to angular, new to stackoverflow. been trying to solve this for days. here is my problem:

我要居中的一组框。

有没有办法来获得访问div的（带有ID或类名）的特性，并在指令操作呢？

Is there a way to get access to properties of div's (with id or class names) and manipulate them in a directive?

在我的HTML我创建的div NG-重复，的div是显示的框。我有我，现在，我试图用它来查找和操作HTML中的div /指令性质的指令，但是我似乎无法做到这一点。

in my html I am creating divs with ng-repeat, the divs are the boxes that are displayed. I have a directive that I, for now, am trying to use to find and manipulate properties of the div's/directives in the html, however I can't seem to do this.

我用Google搜索了很多，已经发现，似乎我的code的工作类似的问题，但没有。

I have googled a lot and have found similar issues but nothing that seems to work in my code.

这里有一个小提琴：
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'));
        }
    };
});

感谢您提供任何帮助。

推荐答案

的原因是因为纳克重复改变DOM中，子元素不可
在指令编译。
所以需要在子元素$手表。

The reason is because ng-repeat changes the DOM, the children elements are not available during directive compilation. so a $watch is needed on child elements.

该通知的子元素相加，然后对它们执行操作指令。

This notifies the directive that child elements are added and then perform operation on them.

在$手表必须跳过节点类型是发表评论：（类型8）

The $watch must skip the nodeType which is "comment:(type 8)"

这里是工作提琴： 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');
                        }
                    }
                });
            }

这篇关于angularjs找到指令DIV的性质的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！