SORU
11 EYLÜL 2012, Salı


Nasıl özel bir yönerge içinde değerlendirilen nitelikler için

Bir almaya çalışıyorumdeğerlendirdiözel talimatımı öznitelik, ama bunu yapmanın doğru yolunu bulamadım.

this jsFiddle ayrıntılı oluşturduk.

<div ng-controller="MyCtrl">
    <input my-directive value="123">
    <input my-directive value="{{1 1}}">
</div>

myApp.directive('myDirective', function () {
    return function (scope, element, attr) {
        element.val("value = " attr.value);
    }
});

Neyi kaçırıyorum?

CEVAP
11 EYLÜL 2012, Salı


Dikkat: daha iyi çözümler bulmak gibi bu cevap güncelleme yaparım. Ben de ilgili oldukları sürece ileride eski cevaplar tutun. En son ve en iyi cevap önce gelir.

İyi cevap:

Angularjs yönergelerin çok güçlü, ama hepsini ardında hangi anlamak gerekir.

Direktifleri oluştururken, angularjs bir oluşturmanızı sağlarkapsam izoleüst kapsam için bazı bağlantıları ile. Bu Bağlantılar tarafından belirtiliröznitelikve nasıl tanımlamak DOM öğesi ekleyinkapsambu özellikDirektif tanımı nesne.

Kapsam olarak tanımlayabilirsiniz hangi bağlama seçenekleri 3 türü vardır ve önekleri ile ilgili olarak bunları yazma özniteliği.

angular.module("myApp", []).directive("myDirective", function () {
    return {
        restrict: "A",
        scope: {
            text: "@myText",
            twoWayBind: "=myTwoWayBind",
            oneWayBind: "&myOneWayBind"
        }
    };
}).controller("myController", function ($scope) {
    $scope.foo = {name: "Umur"};
    $scope.bar = "qwe";
});

HTML

<div ng-controller="myController">
    <div my-directive my-text="hello {{ bar }}" my-two-way-bind="foo" my-one-way-bind="bar">
    </div>
</div>

Direktif kapsamında bu durumda, işlev ya da denetleyicisi bağlama olsun), bu gibi bu özellikleri ulaşabiliriz:

/* Directive scope */

in: $scope.text
out: "hello qwe"
// this would automatically update the changes of value in digest
// this is always string as dom attributes values are always strings

in: $scope.twoWayBind
out: {name:"Umur"}
// this would automatically update the changes of value in digest
// changes in this will be reflected in parent scope

// in directive's scope
in: $scope.twoWayBind.name = "John"

//in parent scope
in: $scope.foo.name
out: "John"


in: $scope.oneWayBind() // notice the function call, this binding is read only
out: "qwe"
// any changes here will not reflect in parent, as this only a getter .

"Yine de iyi" Cevap:

Bu cevabı kabul edildim ama bazı sorunları var bu yana, daha iyi bir güncelleme yapacağım. Görünüşe göre, $parse sadece açısal ifadeler getiriyor geçerli kapsamı, özellikleri içinde yalan olmayan bir hizmet ve kapsamı ulaşır. *12,***13 ifadeleri angularjs onlara erişmek için bizim yönergeleri postlink yöntemi çalıştığımızda, zaten derlenmiş demektir başlatma sırasında derlenir. ({{1 1}} Yönerge 2 zaten).

Bunu kullanmak isterim o kadar

var myApp = angular.module('myApp',[]);

myApp.directive('myDirective', function ($parse) {
    return function (scope, element, attr) {
        element.val("value="   $parse(attr.myDirective)(scope));
    };
});

function MyCtrl($scope) {
    $scope.aaa = 3432;
}​

.

<div ng-controller="MyCtrl">
    <input my-directive="123">
    <input my-directive="1 1">
    <input my-directive="'1 1'">
    <input my-directive="aaa">
</div>​​​​​​​​

Burada dikkat etmeniz gereken tek şey, eğer bu değer dize ayarlamak istiyorsanız, tırnak içine almanız gerekir. (3. bkz: giriş)

Burada keman ile oynamak için: http://jsfiddle.net/neuTA/6/

Eski Cevap:

Değilim çıkarmadan bu millet kim olabilir kandırmış gibi bana, not kullanarak $eval gayet iyi doğru bir şekilde yapmak, ama $parse bir davranış, muhtemelen buna ihtiyacın yok etmek için kullanılan çoğu bu durumda.

Bunu yapmanın yolu, bir kez daha scope.$eval kullanıyor. Açısal ifadesi derler değil sadece, aynı zamanda geçerli kapsamı özelliklerine erişimi vardır.

var myApp = angular.module('myApp',[]);

myApp.directive('myDirective', function () {
    return function (scope, element, attr) {
        element.val("value = "  scope.$eval(attr.value));
    }
});

function MyCtrl($scope) {

}​

Ne kaybettiğinizi $eval.

http://docs.angularjs.org/api/ng.$rootScope.Scope#$eval

Yürütür geçerli kapsam sonucu döndüren ifade. İfadesinde herhangi bir istisna (yakalanmamış) yayılır. Bu açısal ifadeleri değerlendirirken yararlıdır.

Bunu Paylaş:
  • Google+
  • E-Posta
Etiketler:

YORUMLAR

SPONSOR VİDEO

Rastgele Yazarlar

  • dirkgently1

    dirkgently1

    13 NİSAN 2006
  • Goran Dimov

    Goran Dimov

    1 HAZİRAN 2014
  • Strata1000

    Strata1000

    28 EYLÜL 2009