0

この質問が約 100 回尋ねられていることは知っています (信じてください、すべて読んだことがあります) が、ディレクティブがアイソレート スコープを使用していない場合、入力ボックスに移動するのに苦労しています。バッキング データが変更された場合、scope.$watch は起動しません。

分離スコープを持つものを使用しないのはなぜですか? 私の理解では、ディレクティブにテンプレートがある場合にのみ、isolate スコープを使用する必要があります。

ディレクティブの唯一の違いは次のとおりです。

// 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));

編集終了


角度の卓越性を探求するのを手伝ってくれてありがとう!

サッド

4

2 に答える 2

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) {...} );

フィドル

于 2013-08-08T20:55:43.087 に答える
0

一番下の引き出しはisDrawerOpen()、プロパティではなく function を見ていました。
変化する

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

   scope.$watch('toggleBottomDrawer',...);
于 2013-08-08T18:40:37.220 に答える