thủ bootstrapping AngularJS và sau đó nhận được các mô-đun

Question

Nói chung, tôi muốn làm như sau và sẽ có một ng-app trong HTML của tôi:

var myApp = angular.module("myApp", []); 

myApp.controller("AttributeCtrl", function ($scope) { 
    $scope.master = { 
     name: "some name" 
    }; 
}); 

Tuy nhiên, tôi cần phải tự bootstrap góc vì tôi chỉ sử dụng nó trong một phần của ứng dụng của tôi được tải thông qua $.load() của jQuery. Nếu tôi làm như sau:

main.js - đây là nơi trang Tôi muốn sử dụng góc trên đang được kéo vào

$("#form").load(contextPath + url, params, function() { 
    angular.bootstrap($("#angularApp")); 
}); 

Và sau đó trang bị kéo vào đã sở hữu nó javascript:

function AttributeCtrl($scope) { 
    $scope.master = { name: "some name"}; 
} 

Công trình này, tuy nhiên, lý tưởng nhất, tôi muốn các bộ điều khiển của mình được đặt ở mức mô-đun. Vì vậy, tôi sửa đổi mã trên như vậy

main.js

$("#form").load(contextPath + url, params, function() { 
    angular.bootstrap($("#angularApp", ["myApp"])); 
}); 

và sau đó ...

var app = angular.module("myApp"); // retrieve a module 

app.controller("AttributeCtrl", function($scope) { 
    $scope.master = { name: "some name"}; 
}); 

Lấy module theo cách này dường như không làm việc, mặc dù. Tôi có làm điều gì sai?

Answer 1

Tôi không biết nếu điều này chỉ là trong các mã ví dụ bạn có ở đây nhưng:

angular.bootstrap($("#angularApp", ["myApp"])); 

nên

angular.bootstrap($("#angularApp"), ["myApp"]); 

Mã của bạn để lấy các mô-đun nên làm việc.

Answer 2

Cập nhật

Họ cập nhật các tài liệu hướng dẫn và bây giờ nó đọc như thế này

Mỗi mục trong mảng nên là tên của một module được xác định trước hoặc một (DI chú thích) chức năng rằng sẽ được gọi bởi bộ phun như là khối chạy . Xem: {@link angular.module module}

---

Có vẻ như một lỗi.

Cách bạn triển khai để truy xuất mô-đun là chính xác. Chỉ cần trích dẫn nó từ doc để làm cho nó rõ ràng vì nó có thể không được nổi tiếng.

Khi vượt qua hai hoặc nhiều đối số, mô-đun mới sẽ được tạo. Nếu đã vượt qua chỉ một đối số, một mô-đun hiện có (tên được chuyển là đối số đầu tiên cho mô-đun) được truy lục.

Đối với sự cố bạn đã đề cập, câu chuyện dài ...

Chức năng bootstrap gọi createInjector với danh sách module ['ng', ['ngLocale', function(){...}] , 'myApp'] (người cuối cùng là mô-đun bạn thông qua năm)

function bootstrap(element, modules) { 
    ... 
    var injector = createInjector(modules); 

Bên createInjector(), nó gọi loadModules cho mỗi mô-đun thông qua vào

function createInjector(modulesToLoad) { 
    forEach(loadModules(modulesToLoad), function(fn) { instanceInjector.invoke(fn || noop); }); 

Và loadModules gọi angularModule, được khởi tạo là angularModule = setupModuleLoader(window);, tạo đối tượng window.angular.module

function loadModules(modulesToLoad){ 
    .... 
    var moduleFn = angularModule(module); // triggers the error 

Lỗi xảy ra, vì angularModule có tham số thứ 2 là requires. Nếu không có nó, nó sẽ ném một ngoại lệ trên dòng này (dòng 1148) throw Error('No module: ' + name);

Báo cáo: https://github.com/angular/angular.js/issues/3692

Answer 3

Không chắc nếu điều này được tính như là một lỗi hoặc một quyết định thực hiện (mặc dù một vẻ nghèo). Việc thêm một mảng trống sẽ giải quyết vấn đề chưa được xác định require mà bạn đang gặp phải và nên giải quyết vấn đề của bạn tổng thể.

var app = angular.module("myApp", []); // create a module 

app.controller("AttributeCtrl", function($scope) { 
    $scope.master = { name: "some name"}; 
});` 

Ngoài ra, trong fiddle bạn gọi {{name}} sẽ không hiển thị. Bạn nên gọi {{master.name}}

---

Sửa

Cảm ơn tất cả các bạn cho downvotes .. Dưới đây là một ví dụ làm việc. Chúc may mắn!

http://plnkr.co/edit/UowJpWYc1UDryLLlC3Be?p=preview

Answer 4

Bạn không thể tạo bộ điều khiển sau khi đã khởi động ứng dụng. Xem the documentation for angular.bootstrap.

Bạn nên gọi angular.bootstrap() sau khi bạn đã tải hoặc xác định mô-đun của mình. Bạn không thể thêm bộ điều khiển, dịch vụ, chỉ thị, vv sau khi khởi động ứng dụng.