17

ディレクティブで補間値を設定するにはどうすればよいですか? 次のコードから正しい値を読み取ることができますが、設定できませんでした。

js:

app.directive('ngMyDirective', function () {
    return function(scope, element, attrs) {
        console.log(scope.$eval(attrs.ngMyDirective));

        //set the interpolated attrs.ngMyDirective value somehow!!!
    }
});

html:

<div ng-my-directive="myscopevalue"></div>

ここmyscopevalueで、コントローラーのスコープの値です。

4

2 に答える 2

45

ディレクティブが isolate スコープを使用せず、属性を使用してスコープ プロパティを指定し、そのプロパティの値を変更する場合は常に、$parseを使用することをお勧めします。(構文は $eval よりも優れていると思います。)

app.directive('ngMyDirective', function ($parse) {
    return function(scope, element, attrs) {
        var model = $parse(attrs.ngMyDirective);
        console.log(model(scope));
        model.assign(scope,'Anton');
        console.log(model(scope));
    }
});

fiddle

$parse属性にドットが含まれているかどうかに関係なく機能します。

于 2013-05-11T16:26:06.690 に答える
24

スコープに値を設定したいが、(事前に) プロパティの名前がわからない場合は、次のobject[property]構文を使用できます。

scope[attrs.myNgDirective] = 'newValue';

属性の文字列にドットが含まれている場合 (例: myObject.myProperty)、これは機能しません。$eval割り当てを行うために使用できます。

// like calling  "myscopevalue = 'newValue'"
scope.$eval(attrs.myNgDirective + " = 'newValue'");

[更新:$parseの代わりに実際に使用する必要があり$evalます。マークの答えを参照してください。]

分離スコープを使用している場合は、=注釈を使用できます。

app.directive('ngMyDirective', function () {
    return {
        scope: {
            theValue: '=ngMyDirective'
        },
        link: function(scope, element, attrs) {
            // will automatically change parent scope value
            // associated by the variable name given to `attrs.ngMyDirective`
            scope.theValue = 'newValue';
        }
    }
});

この Angular/jQuery カラー ピッカー JSFiddleの例 でこの例を見ることができます。ここでは、ディレクティブ内に割り当てると、コントローラーのスコープでディレクティブに渡されscope.colorた変数が自動的に更新されます。

于 2013-05-11T06:29:11.973 に答える