2015-06-26 14 views
7

Dưới đây là mẫu html của tôi:giá trị Passing từ chỉ thị để điều khiển

<div ng-app="dr" ng-controller="testCtrl"> 
    <test color1="color1" data-method="ctrlFn(msg)"></test>  
</div> 

Dưới đây là mã của tôi:

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

app.controller("testCtrl", function($scope) { 
    $scope.ctrlFn = function(arg) {   
     alert(arg); 
    } 

}); 
app.directive('test', function() { 
    return { 
     restrict: 'E', 
     scope: { 
      fromDirectiveFn: '&method' 
     }, 
     link: function(scope, elm, attrs) { 
      //Way One 
      scope.hello = "some message"; 
      scope.fromDirectiveFn(scope.hello); 
     } 
    } 
}); 

<div ng-app="dr" ng-controller="testCtrl"> 
    <test color1="color1" data-method="ctrlFn(msg)"></test>  
</div> 

Tại sao tôi nhận được "không xác định" thay vì "một số thông điệp "

Dưới đây là một fiddle http://jsfiddle.net/j2K7N/27/

Trả lời

10

Mã của bạn gần như đúng, tuy nhiên bạn có một số vấn đề ở đây:

<test color1="color1" data-method="ctrlFn(msg)"></test> 

Ở đây bạn vượt qua ctrlFn() chức năng từ điều khiển của bạn, trong đó có một đối số không xác định msg, gây ra các thông điệp cảnh báo với nội dung "không xác định". Tôi đề nghị sửa đổi mã HTML thành mã này:

<test color1="color1" data-method="ctrlFn"></test> 

Lưu ý rằng tôi chuyển ctrlFn làm biến, không hoạt động.

Trong mã chỉ thị của bạn, tôi đã thay đổi phạm vi gắn kết thành = để đảm bảo rằng ctrlFn sẽ trỏ đến chức năng điều khiển của bạn. Điều này cũng thiết lập một ràng buộc hai chiều giữa phạm vi của chỉ thị và phạm vi bộ điều khiển (cha mẹ). Sau đó, toàn bộ mã JS của chỉ thị sẽ trông như thế này:

app.directive('test', function() { 
    return { 
     restrict: 'E', 
     scope: { 
      fromDirectiveFn: '=method' 
     }, 
     link: function(scope, elm, attrs) { 
      //Way One 
      scope.hello = "some message"; 
      scope.fromDirectiveFn(scope.hello); 
     } 
    } 
}); 

Chỉ cần thay thế &-=. Bàn làm việc: http://jsfiddle.net/L8masomq/

2

chút của một đứa ... đọc thêm về nó here

những gì bạn cần làm là - sự thay đổi dưới đây

scope.fromDirectiveFn(scope.hello); 

để

scope.fromDirectiveFn({'msg' : scope.hello}); 

tên biến nên giống nhau trong người gọi & callee

Các vấn đề liên quan