Soru Açısal direktifte enterpolasyonlu bir değer nasıl ayarlanır?


Yönlendirilmiş değeri bir direktifte nasıl belirlerim? Aşağıdaki koddan doğru değeri okuyabiliyorum, ancak bunu ayarlayamadım.

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>

nerede myscopevalue denetleyicimin kapsamındaki bir değer.


17
2018-05-11 06:24


Menşei




Cevaplar:


Kapsam üzerinde bir değer belirlemek istiyorsanız ancak mülkün adını bilmiyorsanız (zamanın önünde), kullanabilirsiniz object[property] sözdizimi:

scope[attrs.myNgDirective] = 'newValue';

Nitelikteki dize bir nokta içeriyorsa (ör. myObject.myProperty), bu işe yaramaz; kullanabilirsiniz $eval Ödev yapmak

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

[Güncelleme: Gerçekten kullanmalısın $parse yerine $eval. Görmek Mark'ın cevabı.]

İzolat kapsamı kullanıyorsanız, = açıklama:

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';
        }
    }
});

Bunun bir örneğini görebilirsiniz. Bu Açısal / jQuery renk seçici JSFiddle örneği, atandığında scope.color Direktifin içinde geçirilen değişken otomatik olarak güncellenir içine kontrolörün kapsamı ile ilgili direktif.


24
2018-05-11 06:29



kapsam [attrs.myNgDirective] = 'newValue'; çalıştı! myNgDirective'in değeri, kapsamın bir alt nesnesi değil, doğrudan kapsam üzerinde olmak zorundadır. hangisi mantıklı - Anton
Yapabileceğine inanıyorum $eval nesne gösterimi için bir atama ifadesi ile; Cevabımı güncelleyeceğim. - Michelle Tilley
Süper olurdu. kapsam gibi bir şey. $ eval (attrs.ngMyDirective = 'new value')? - Anton
mükemmel tam olarak ihtiyacım olan şey. Şimdi ruhumda iyimserim çünkü yığın bir kereden fazla yapmama izin vermiyor - Anton
tercih ederim $parse üzerinde $eval. Daha fazla bilgi için cevabımı görün. - Mark Rajcok


Bir yönerge bir yalıtma kapsamı kullanmadığında ve bir öznitelik kullanarak bir kapsam özelliğini belirtirseniz ve bu özelliğin değerini değiştirmek isterseniz, şunu kullanmanızı öneririm $ ayrıştırma. (Bence sözdizimi $ eval'dan daha güzel.)

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

keman

$parse özniteliğin bir nokta içerip içermediğini belirler.


45
2018-05-11 16:26



ilginç şeyler. Cevap için teşekkürler. Ayrışmanın değerlendirmeden daha iyi bir terim / sözdizimi olabileceğine dair bir noktanız olabilir. şerefe - Anton
Kapsam yalıtımı olmadan '=' uygulamak kesinlikle doğru bir yoldur. - Maxim Mazin
Eklemek zorundaydım scope.$apply() sonra model.assign(...) Direktifimin değişimini görüşe yansıtabilmek için. Temiz bir çözüm var mı? - Juljan
Yönergenin bir döngü içinde olması halinde bir çözümünüz var mı? Böyle bir durumda, bu her zaman güncellenen ilk öğedir. - Juljan
Bu güçlü bir teknik ve tam da aradığım şey. Örneğin, $ eval alanında JSON atamasını bulamadım, ancak bu çözüm bunun için çalışıyor. - Jeff Ancel