Question

我知道这个问题已经被问了大约100次（相信我，我已经全部阅读过了），但是当指令不使用隔离时，我很难集中精力去输入框范围。范围。$ watch在备份数据更改时不会触发。

为什么不使用具有隔离范围的那个，你问？好吧，我的理解是，如果你的指令有模板，你应该只使用隔离范围。

指令的唯一区别是：

// works
app.directive('doesFocus', function ($timeout) {
    return {
        scope: { trigger: '@doesFocus' },
        link: function (scope, element) {
            scope.$watch('trigger', function (value) {
              // sets focus
            }
            ...

// does not work, and in fact when I inspect attrs.doesNotFocus it is undefined
app.directive('doesNotFocus', function ($timeout) {
    return {
        scope: false,
        link: function (scope, element, attrs) {
            scope.$watch(attrs.doesNotFocus, function (value) {
              // sets focus
            }
            ...

我在使用Angular的第3周，所以我必须错过一些愚蠢的语义问题。

这是一个说明我的问题的小提琴。 http://jsfiddle.net/tpeiffer/eAFmJ/

<小时/> 修改

我的实际问题是我的真实代码是这样的（嘲笑问题的危险，你有时会掩盖真正的问题）：

<input should-focus="{{isDrawerOpen()}" ... ></input>

但是因为我使用的是函数而不是属性，所以我错过了所需的刻度

<input should-focus="{{'isDrawerOpen()'}}" ... ></input>

修改此问题，我的指令仍然可以像这样：

scope.$watch(attrs.shouldFocus, focusCallback(newValue));

结束编辑

感谢您帮助我追求卓越角度！

萨德

Answer 1

从HTML中删除{{}}。所以而不是：

<input class="filter-item" placeholder="Enter filter" 
 does-not-focus="{{bottomDrawerOpen}}" type="text">

使用

<input class="filter-item" placeholder="Enter filter" 
 does-not-focus="bottomDrawerOpen" type="text">

然后它适用于观看attrs.doesNotFocus：

scope.$watch(attrs.doesNotFocus, function (value) {...} );

Fiddle

Answer 2

你的底部抽屉正在观看一个功能isDrawerOpen()，而不是一个属性改变

   scope.$watch('isDrawerOpen()',...);

到

   scope.$watch('toggleBottomDrawer',...);

AngularJS - 使用NON-ISOLATE指令将焦点设置为元素

2 个答案: