Question

我正在尝试做一些非常简单的事情：

我定义了一个指令（'A'类型），当scope属性发生变化时需要操作该元素。

JS

 app.directive("autoAnimation", function ()
        {
            return {
                restrict: 'A',
                scope: {
                    animateChanged: '=',
                    maxHeight: '@'//for the first time
                },
                link: function (scope, element, attrs)
                    {
                        var isFirstTime = true;
                        scope.$watch('animateChanged', function (newVal)
                        {
                          console.log(newVal)

                                   //Trying to get the 'element' but it's not available - what can I do to get the ul element and manipulate it?
                                    //why it's not available?

                        });

                    }
            };
        });

HTML

 <body ng-controller="MainCtrl">
   <input type="checkbox" ng-model='isChecked' />
   <ul auto-animation animate-changed='isChecked'>
     <li>Test</li>
     <li>Test</li>
     <li>Test</li>
     <li>Test</li>
     <li>Test</li>
   </ul>

  </body>

问题是当'animateChanged'改变时，'element'（和scope）参数不可用。

这是plunker。

我的问题：

1）为什么它不可用？
2）当'animateChanged'被更改时，我该怎么做才能操纵'ul'元素（声明指令的地方 - 参见HTML）？

修改

我没有检查这个例子，在这个例子中它是可用的（我的不好，对不起）但在我的项目中，它不可用，我无法将示例带到我的情况......（在我的项目中，使用ng-repeat动态地构建UL）。知道什么可能导致这种行为吗？

Answer 1

它们可用，只需将手表内部更改为console.log（newVal，element，scope）：

console.log(newVal, element, scope)

Plnkr：http://plnkr.co/edit/NZq6G04zsVBg2GgNWZkv?p=preview

Answer 2

当您$watch进入链接功能以便（元素）可用时，请更改为：

console.log(element);

实际上console.log(newVal)正在输出所点击元素的状态，所以当checked:true/unchecked:false时。

AngularJS指令 - 链接功能元素参数在监视功能中不可用

2 个答案: