7

Tôi đã nhìn thấy rất nhiều câu hỏi này nhưng chưa tìm thấy giải pháp nào hoạt động. đây là một fiddle không hoạt động nhưng nên.Vượt qua các đối số từ chỉ thị đến chức năng điều khiển

http://jsfiddle.net/cdparmeter/j2K7N/2/

Bộ điều khiển:

$scope.foo = function (textArray) { 
    console.log(textArray) 
}; 

Chỉ thị:

return { 
    restrict: 'E', 
    replace: 'true', 
    scope: { 
     methodToCall: '&method' 
    }, 
    template: "<div> 
     <input ng-model='textToPush'/> 
     <button ng-click='pushText'>Push</button> 
     <button ng-click='finish'>Finish</button> 
    </div>", 
    link: function (scope, element, attrs) { 
     scope.paragraphs = []; 
     scope.pushText = function() { 
      scope.paragraphs.push(scope.pushText); 
      scope.pushText = ""; 
     } 
     scope.finish = function() { 
      scope.methodToCall(scope.paragraphs) 
     } 
    } 
} 

HTML:

<div ng-app="MyApp"> 
    <div ng-controller="MyController"> 
     <container data-method="foo"> 
    </div> 
</div> 

Tôi đang xây dựng một mảng bên trong chỉ thị của tôi mà cần tùy chỉnh ha ndling trong bộ điều khiển của phạm vi cha mẹ. Tôi biết tôi có thể ném một chiếc đồng hồ trong phạm vi cha mẹ trên một mô hình mà tôi truyền vào chỉ thị của tôi nhưng điều đó có vẻ như bị tấn công và bẩn thỉu. bất kỳ đề xuất?

Trả lời

12

Trước khi trả lời câu hỏi của bạn tôi phải nói rằng kịch bản của bạn chứa một vài lỗi:

  1. Bạn đang ràng buộc đầu vào cho một biến gọi là textToPush, và sau đó sử dụng một chương trình khác bên trong pushText function (pushText) ;
  2. Bạn không đặt chỉ thị ng-click chính xác; phải là ng-click="pushText()" thay vì ng-click="pushText". Tương tự cho finish;

Bây giờ, hãy quay lại câu hỏi của bạn. Để gọi một hàm của phạm vi cha mẹ qua các đối số, bạn có thể nhận được một tham chiếu đến hàm đầu tiên, và sau đó thực hiện nó:

scope.finish = function() { 
    var func = scope.methodToCall();     
    func(scope.paragraphs); 
} 

Dưới đây là một working version của kịch bản của bạn.

Bạn cũng có thể làm được điều này, nếu bạn thích:

scope.finish = function() { 
    scope.methodToCall({value: scope.paragraphs});         
} 

Nhưng đối với mã này để làm việc bạn nên thay đổi đánh dấu của bạn để:

<container data-method="foo(value)"/> 

Dưới đây là another jsFiddle cho thấy giải pháp trên.

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