2016-08-15 59 views
0

我無法弄清楚爲什麼我的控制器和模塊沒有像我一起學習的教程那樣綁定。我使用的是Brackets程序,它提供了我的代碼的實時預覽,而不是顯示$ scope.message,它只顯示單詞{{message}}。我剛剛開始學習angularjs。在文檔的頭部,我使用腳本標記和src =「https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js」 這裏是body ... Angular.js綁定(簡單的html文檔)

您已成功地到達我的HTML文檔!

<div ng-app="myModule" ng-controller="myController"> 

    <!h5 tag contains a binded expression> 

     <h5> {{message}} </h5> 
    <ul> 
     <li ng-repeat="x in cars"> {{x}} </li> 

     </ul> 


    </div> 


    <!Create a module named 'myModule'Create controller named 'myController'> 

    <script> 


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

    myApp.controller("myController", function ($scope){ 

     $scope.cars = ["BMW", "Toyota", "Ford", "Range Rover"]; 
     $scope.message = "My students are the best in the world!"; 

    }) 

    </script> 


</body> 
+0

是否當您在瀏覽器甚至'文件打開它的工作? – pr0gramist

+0

我覺得你可能會遇到錯誤。你有沒有在控制檯中看到任何東西? – 1252748

+0

它顯示{{message}},但在教學視頻中,他的瀏覽器顯示實際的信息「我的學生是世界上最好的!」我正在複製他的代碼行,並使用與所建議的相同的程序「Brackets」。 –

回答

0

角檢測到您的ngApp之前創建的模塊,因此拋出一個異常$injector:modulerr。如果你打開你的控制檯,你可以看到這個。將文檔中的腳本移動到應用了ngApp的容器上方可解決您的問題。

http://jsbin.com/quxinozubu/edit?html,js,output

0

你的代碼是爲我工作的罰款。我剛看到一個簡單的錯誤。你錯過了控制器中的分號。 /// ..`:

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

 
    myApp.controller("myController", function ($scope){ 
 

 
     $scope.cars = ["BMW", "Toyota", "Ford", "Range Rover"]; 
 
     $scope.message = "My students are the best in the world!"; 
 

 
    });
<!DOCTYPE html> 
 
<html> 
 
    <head> 
 
    <meta charset="utf-8"> 
 
    <title></title> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
 

 
    </head> 
 
    <body> 
 

 
    <div ng-app="myModule" ng-controller="myController"> 
 

 

 

 
     <h5> {{message}} </h5> 
 
    <ul> 
 
     <li ng-repeat="x in cars"> {{x}} </li> 
 

 
     </ul> 
 

 

 
    </div> 
 

 

 

 
    
 

 

 
</body> 
 
</html>

+0

@ Kasper_Sky,如果您認爲這有幫助,請將其標記爲答案。 –