Angularjs chuyển biến cho một chỉ thị với một phạm vi thừa kế (không bị cô lập)

Question

Nếu tôi đang sử dụng một phạm vi cô lập tôi có thể vượt qua một biến trên một thuộc tính.

tức

<my-directive baz='foo.bar'> 

Sau đó, trên của chỉ thị javascript

.directive('myDirective', function() { 
    return { 
    scope: { 
     'baz': '=' 
    } 
    } 
}); 

Có cách nào để làm điều gì đó tương tự với một phạm vi di truyền? Hàm liên kết chỉ chuyển chuỗi.

Hiện tại tôi đang tự phân tích cú pháp biến và so khớp biến đó với phạm vi. $ Parent. Có vẻ như cần có một hàm trợ giúp hoặc cách dễ dàng hơn để thực hiện nó.

Answer 1

Sử dụng $eval hoặc $parse:

<my-directive baz='foo.bar'> 

.directive('myDirective', function($parse) { 
    return { 
    scope: true, 
    link: function(scope, element, attrs) { 
     console.log(scope.$eval(attrs.baz)); 
     var model = $parse(attrs.baz); 
     console.log(model(scope)); 
     // if you want to modify the value, use the model, not $eval: 
     model.assign(scope, "new value"); 
    } 
    } 
}); 

Answer 2

Nếu bạn không khai báo các đối tượng phạm vi trong chỉ thị, sẽ không có thiết lập phạm vi cô lập và bạn sẽ nhận được quyền truy cập vào các phạm vi được truyền vào từ nơi div được khai báo trong DOM.

Something như thế này:

.directive('myDirective', function() { 
    return { 
    function(scope, element, attrs){ 
     //scope here = the inherited scope from the DOM 
    } 
} 

Vì vậy, nếu bạn đã chỉ thị của bạn khai báo trong thẻ DIV, bạn không cần phải thực sự gửi vào giá trị như một thuộc tính - bạn chỉ có thể kéo nó ra khỏi phạm vi.

Answer 3

với mã này:

link: function(scope, elem, attrs) {} 

bạn có thể sử dụng

attrs 

yếu tố để có được tất cả atributes gán cho chỉ thị này.

sau đó bạn có thể chỉ định đơn giản attrs cho bất kỳ phạm vi và sử dụng nó trong templae e.x của bạn.

scope.someValue = attrs.attrName; 

Tóm lại:

Chỉ thị:

link: function(scope, elem, attrs) { 
     scope.someValue = attrs.attrName; 
    } 

Chỉ thị mẫu:

<div> {{someValue}} <div> 

Chỉ gọi

<my-directive attrName="foo"> </my-directive>