2016-07-08 17 views
5

Tôi có một chỉ thị tùy chỉnh mà trông như thế này:

<my-queue id="report.id" version="report.version"></my-queue> 

Trong đối tượng định nghĩa chỉ thị của tôi, tôi tham khảo điều khiển và phạm vi của tôi như vậy:

controller: 'QueueController', 
controllerAs: 'myQueue', 
scope: { 
    id: '=', 
    version: '=' 
} 

Trong bộ điều khiển của tôi, tôi đặt var vm = this vì vậy tôi có thể tham chiếu đến các biến phạm vi là vm.variable. Tuy nhiên, điều này không hoạt động cho idversion. Tôi đã tìm thấy rằng tôi cần phải tiêm $scope và tham chiếu các thuộc tính này là $scope.id$scope.version. Có cách nào để thiết lập điều này để tôi có thể tránh tiêm $scope và luôn phù hợp với phần còn lại của bộ điều khiển của tôi bằng cách tham chiếu vm.idvm.version?

+0

Không. Tạo một phạm vi cô lập như bạn có là cách thích hợp để xử lý việc này. – jbrown

Trả lời

4

Bộ điều khiểnNhư thuộc tính trên đối tượng cấu hình chỉ thị của bạn sẽ là những gì bạn sử dụng để tham chiếu đến trường hợp bộ điều khiển của bạn, vì vậy nếu bạn muốn sử dụng vm trong mẫu của mình, bạn cần đặt thuộc tính controllerAs thành vm. Ngoài ra, bằng cách thiết lập bindToController tài sản để true bạn có thể liên kết trực tiếp đến mô hình điểm thay vì $ phạm vi:

function myQueue() { 
    return { 
     restrict: 'E', 
     template: ... , 
     controller: myQueueCtrl, 
     controllerAs: 'vm', 
     scope: { 
      id: '=', 
      version: '=' 
     }, 
     bindToController: true 
    } 
} 

Với cấu hình chỉ hiện tại của bạn, controllerAs tài liệu tham khảo của bạn sẽ chịu myQueue, không vm, có nghĩa là bất kỳ thuộc tính bạn tạo trên vm (ví dụ: vm.id) trong bộ điều khiển của bạn sẽ ở trên myQueue trong mẫu của bạn (ví dụ: myQueue.id).

Bằng cách thêm bindToController chúng ta không cần phải tiêm $ phạm vi trong điều khiển của chỉ thị:

function QueueController() { 
    var vm = this; 
} 

Sau đó, bạn có thể tham khảo vars của bạn trong các mẫu chỉ thị như

{{vm.id}} 
{{vm.version}} 

Có một plunker here của chỉ thị của bạn với bindToController được đặt thành true và controllerAs được đặt thành vm.

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