6

Tôi đang làm việc trên hướng dẫn góc cạnh và tôi đang gặp vấn đề khi bắt đầu. Tải mô-đun myApp ném lỗi. Như đã giải thích trong hướng dẫn, đây là một trong ba cách để tạo bộ điều khiển.

Dưới đây là màn hình in từ hướng dẫn tôi đang làm việc trên: Creating controllers in tutorialsLỗi không bắt buộc: Mô-đun 'myApp' không khả dụng! (AngularJS)

Khi tôi làm mới trang web tôi nhận được lỗi này trong Chrome console:

Uncaught Error: [$injector:modulerr] Failed to instantiate module myApp due to: 
Error: [$injector:nomod] Module 'myApp' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument. 

này được tập tin HTML của tôi

<html ng-app="myApp"> 
     <head> 
     </head> 
     <body> 
      <h1>Hello world!</h1> 

      <div ng-controller="MainController"> 
       {{ 2+2 }} 
       <br> 
       {{ val }} 
      </div> 
      <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.js"></script> 
      <script src="app.js"> 
     </body> 
    </html> 

Đây là tệp app.js của tôi

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

var MainController = function($scope){ 
    $scope.val = "Main controller variable value" 
} 

Vì vậy, vấn đề của tôi là gì? Tôi không thể hiểu được.

Cảm ơn bạn trước

Trả lời

9

Module 'myApp' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.

Sự cố ban đầu của bạn là do thẻ tập lệnh không hợp lệ. Về cơ bản, thẻ script của bạn không được đóng, nó cần phải được đóng lại để trình duyệt tải xuống tệp app.js. Các thẻ script không tự đóng nên nó cần một thẻ đóng.

<script src="app.js"> 

nên

<script src="app.js"></script> 

Bây giờ khi bạn khắc phục điều đó, bạn sẽ nhận được vào lỗi khác.

[ng:areq] Argument 'MainController' is not a function, got undefined

Vì bạn đang sử dụng phiên bản góc mới nhất, tức là> = 1.3.x cần bộ điều khiển được đăng ký theo cách thủ công bằng cách sử dụng cấu trúc .controller. See here for more details.

Lưu ý - có một chút khó hiểu vì ảnh chụp màn hình hiển thị cho bạn sử dụng 1.2.0 (không nhất thiết cần đăng ký bộ điều khiển rõ ràng) nhưng đoạn trích trong câu hỏi được hiển thị 1.4.x.

+2

Đôi mắt đẹp .. +1 sir –

+0

bạn đã đúng! đôi mắt thực sự tốt đẹp .. cảm ơn bạn! –

+2

:) cảm ơn các bạn .. – PSL

4

Bạn nên đăng ký một controller để module góc myApp.

App.js

var myApp = angular.module('myApp', []); 
myApp.controller('MainController', MainController); 
var MainController = function($scope){ 
    $scope.val = "Main controller variable value" 
} 

Về cơ bản những gì bạn đang làm là đúng nhưng mã đó đã được theo sau bởi các phiên bản cũ của AngularJS, Cách bạn tuyên bố điều khiển của bạn là gì, nhưng được gọi là điều khiển Như chức năng , cần bật phương thức allowGlobals() của $controllerProvider. Vì phương pháp Angular 1.3 + allowGlobals() bị vô hiệu hóa bằng cách thêm mã bên dưới, bạn có thể bật nó lên, để làm cho mã của bạn hoạt động nhưng nó không được khuyến khích để làm điều này.

Config

myApp.config(['$controllerProvider', 
    function($controllerProvider) { 
    $controllerProvider.allowGlobals(); 
    } 
]); 

Tham khảo cùng SO Answer đây

2

Hãy thử điều này:

myApp.controller ("MainController",[$scope, function ($scope){ 
     $scope.val = "Main controller variable value" 
}]); 

Chỉ thị ng-controller trông cho MainController trong mô-đun MyApp của bạn.

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