Question

对于以下小提琴https://jsfiddle.net/qcuennL5/，我想访问＆＃34;元素＆＃34;内部范围。$ watch（＆＃39; $ select.isOpened＆＃39;，...）。我该怎么办？

scope.$watch('$select.isOpened', function(isOpened) {

if(isOpened) {
    //Don't have access to 'element'. Hacked with $('...')
        $('div.dropdown').show();
    } else {
        $('div.dropdown').hide();
}

Answer 1

您可以访问element参数。

从chrome调试器中，如果正在执行的函数中未使用被检查的属性，我们将无法检查闭包属性。

控制台语句将正确打印该值。

不确定这是否是Chrome错误。

Answer 2

您不需要使用jQuery或观看范围内的任何对象。

只需像这样使用ng-show指令......

ng-show="$select.isOpened"

<强> JS / TEMPLATE

template: '<div class="select" ng-click="$select.click(\'I was clicked!\', $event)">' +
                '<div class="select-label">{{title}}</div>' +
                '<div class="select-caret"><span class="select-dropdown"></span></div>' +
                '<div class="dropdown" ng-show="$select.isOpened">This is a dropdown!</div>' +
          '</div>'

同时从CSS中的display中删除div.dropdown属性

<强> JSFIDDLE

使用$ watch

scope.$watch('$select.isOpened', function (isOpened) {
    scope.isOpened =   isOpened;  // assign isOpened to new variable on the scope.

    // Stick the rest of your logic here            
});

<强> HTML

'<div class="dropdown" ng-show="isOpened">This is a dropdown!</div>'

AngularJS - 访问＆＃34;元素＆＃34;内部范围。$ watch回调函数

2 个答案: