未捕獲ReferenceError：未定義角度

-1

我正在嘗試創建一個簡單的Angular應用程序來從控制器中的數組中搜索名稱。每次運行應用程序時，我都會在控制檯中看到'未捕獲的引用錯誤：角度未定義'。我在網上查看過類似的問題，但似乎沒有涵蓋我所經歷的事情。未捕獲ReferenceError：未定義角度

我的HTML是...

<!DOCTYPE html> 
<html ng-app="myApp"> 
    <head> 
     <link type="text/css" rel="stylesheet" href="../app/styles/styles.css"/> 
     <script src="../scripts/controllers/mycontroller.js"></script> 
     <a class="header" href="../app/index.html"><h1>App</h1></a> 
    </head> 
    <body> 
     <div class="main-container"> 
      <div id="left"class="main"> 
       <h2>Search by:</h2> 
       <a href="search-name.html">Name</a><br/><br/> 
       <a href="search-salary.html">Salary</a><br/><br/> 
       <a href="search-date.html">Date</a><br/><br/> 
      </div> 
      <div ng-controller="MyCtrl" id="middle" class="main"> 
       <h2>Search name</h2> 
       <div> 
        <div> 
         <input type="text" style="color:black;" placeholder="Name here..." ng-model="userSearch"> 
        </div> 
       </div> 
       <div> 
        <div ng-repeat="user in users | filter:userSearch"> 
         <div> 
          {{user.firstname}} {{user.lastname}} 
         </div> 
        </div> 
       </div> 
       <button style="color:black;" >Go</button> 
      </div> 
      <div id="right" class="main"> 
       <h2>Sidebar</h2> 
      </div> 
     </div> 
     <div id="footer"> 
      <a href="google.com">Link1</a> 
      <a href="google.com">Link2</a> 
      <a href="google.com">Link3</a> 
      <a href="google.com">Link4</a> 
      <a href="google.com">Link5</a> 
     </div> 
    </body> 
</html>

和我控制器劇本...

'use strict'; 

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

myApp.controller('MyCtrl', function ($scope) { 

    $scope.users = [ 

    {firstname: 'john', lastname: 'smith'}, 
    {firstname: 'jane', lastname: 'due'}, 
    {firstname: 'bob', lastname: 'rand'} 

    ]; 
});

我很新的角度框架，所以請原諒我，如果我的職位是笨。

非常感謝幫助，謝謝！

來源

2015-05-17 sMilbz

如果你投下了，你至少可以解釋爲什麼？ – sMilbz

不要將您的控制器名稱傳入模塊。只需寫angular.module（'MyApp'，[]）;當然，正如@Oka所提到的，確保你有angularjs鏈接！ http://plnkr.co/edit/IOadeEPpcXlId93VEq2I?p=preview – jme11

我投票結束這個問題作爲題外話，因爲沒有包含角文字。類似於「印刷錯誤」，但不僅僅是一個錯字。 – krillgar

angular未定義，因爲您從未包含它。

控制器腳本之前添加以下內容：

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>

或者去https://angularjs.org/並找到包括角最適合你的方法。

來源

2015-05-17 11:55:52 Oka

我之前在頭部加了這個。它出現了相同的錯誤，但包括「（匿名函數）\t @ \t angular.js：」@Oka – sMilbz

調試你的代碼將是艱難的（特別是沒有一個正確的測試用例），因爲它是絕對成熟的錯誤 - HTML和JS 。我建議遵循[AngularJS教程]（https://docs.angularjs.org/tutorial）以及[MDN]上的基本HTML/JS（https://developer.mozilla.org/en -US /文檔/網絡）。 – Oka

我認爲這只是對AngularJS模塊工作方式的誤解。

模塊是Angular應用程序的頂級組件，可讓您組織代碼並關聯HTML文檔的區域。當你創建一個模塊，它佔用三個參數：

模塊
集上的模塊依賴模塊的名稱。這是第二個參數的數組，它錯誤地添加了您的控制器名稱，爲不存在的稱爲MyCtrl的模塊創建依賴項。
該模塊的配置（與調用module.config相同）。

您犯的錯誤是您試圖將控制器名稱傳入模塊。控制器是通過首先調用模塊綁定到模塊的第二級組件。

您已通過使用您爲模塊myApp定義的變量將控制器連接到模塊。換句話說，在這裏你有：

myApp.controller('MyCtrl', function ($scope) { ...

你可能很容易寫，作爲：

angular.module('myApp').controller('MyCtrl', function ($scope) { ...

當你定義一個模塊第一時間，必須指定名稱和依賴關係的第二個參數，即使不存在依賴關係也是如此。所以，在沒有依賴關係的地方，只需傳遞一個空數組[ ]即可。如果你不包含第二個參數，Angular會查找一個已經使用該名稱定義的模塊。

來源

2015-05-17 13:03:51 jme11

未捕獲ReferenceError：未定義角度

回答

相關問題