Giao diện người dùng góc: Nhà cung cấp không xác định: dialogProvider

Question

Tôi đang cố gắng sao chép ví dụ về Giao diện người dùng góc sau đây của một hộp thoại đơn giản bằng nút đóng. https://github.com/angular-ui/bootstrap/blob/master/src/dialog/README.md. Tuy nhiên, tôi không thể nhận được thông số dialog để được tiêm đúng vào bộ điều khiển hộp thoại của tôi.

Các bộ điều khiển trông giống như dưới đây (sử dụng CoffeScript)

angular.module('myApp', ['ui.bootstrap']) 

angular.module('myApp').controller 'MyController', ($dialog, $scope) -> 
    $dialog.dialog().open('dialogTemplate', 'DialogController') 

angular.module('myApp').controller 'DialogController', ['$scope', 'dialog', ($scope, dialog) -> 
    $scope.close = -> dialog.close() 
] 

Xem Plunker cho một phiên bản trực tiếp: http://plnkr.co/edit/ejKh7w8Sk9H7Nz3rXhdc?p=preview

góc mang lại cho tôi những lỗi sau:

Unknown provider: dialogProvider <- dialog 

Bất kỳ ý tưởng về cách tham số dialog có thể được tiêm vào DialogController, như được thấy trong t ví dụ về tài liệu được nêu ở trên? Tôi nghi ngờ điều này có thể có một cái gì đó để làm với CoffeeScript vì tôi khá mới với ngôn ngữ này, nhưng nó có vẻ khá đúng khi tôi nhìn vào đầu ra biên dịch.

Answer 1

Tôi đã có một vấn đề tương tự và đã đấu tranh để tìm một giải pháp.

Tôi đã mong đợi hai đối số bổ sung cho bộ điều khiển của mình; ..., selectedView, dialog). Nó dường như cung cấp hộp thoại của tôi với các đối số đúng, nhưng tôi vẫn gặp lỗi trong bảng điều khiển.

Vấn đề là tôi đã tham khảo bộ điều khiển hai lần;

1. Khi mở hộp thoại của tôi: dialog.open('template', 'myController')
2. Trong template tập tin của tôi: section(ng-controller='myController')

Loại bỏ (2) giải quyết được vấn đề, vì đó không được gọi bởi mã thoại, trong đó cung cấp selectedView của tôi đối số và đối số mặc định dialog.

Hy vọng rằng sẽ giúp ai đó.

Answer 2

Nhà cung cấp hộp thoại có tên $dialog (s. dialog.js). Vì vậy, bạn phải đặt tên cho giá trị được tiêm $dialog giống như bạn đã thực hiện chính xác trong MyController.

angular.module('myApp').controller 'DialogController', ['$scope', '$dialog', ($scope, $dialog) -> 
    $scope.close = -> dialog.close() 
] 

→ Plunker

Lưu ý: Khi bạn xác định sự phụ thuộc của bạn là chuỗi các đối số bộ điều khiển có thể được đặt tên theo ý muốn:

... ['$scope', '$dialog', (myscope, mydialog) -> ... 

Answer 3

Kristofer Sommestad nằm ngay tại đây. nhưng tôi đã gặp vấn đề tương tự.problem là một số phiên bản cũ hơn của ui-bootstrap-tpls (như phiên bản 0.11.0) không hỗ trợ $dialog .so sử dụng phiên bản mới của ui-bootstrap-tpls.