anglejsのコントローラとビューの間の接続

MVCアーキテクチャのAngularJSスクリプトに問題があります。これらのエラーは、モデルレイヤー、ビューレイヤー、およびコントローラーレイヤー間の接続が正しくないためだと思います。anglejsのコントローラとビューの間の接続

JS：

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

myApp.controller('MainController', ['$scope', function MainController($scope) { 
    $scoope.title = "top sellers in books"; 
}]); 
//MainController.js

HTML：

<!DOCTYPE html> 
<html> 
    <head> 
     <title>Angular Js</title> 
     <link rel="stylesheet" type="text/css" href="bootstrap.min.css"> 
     <script src="js/angular.js"></script> 
    </head> 
     <body ng-app="myApp"> 
     <div class="header"> 
      <div class="container"> 
       <h1>book end</h1> 
      </div> 
     </div> 

     <div class="Main" ng-controller="MainController"> 
      <div class="container" ng-model="title"> 
       <h1>{{ title }}</h1> 
      </div>  
     </div> 

     <div class="footer"> 
      <div class="container"> 
       <h2>Available for iphone and android</h2> 
       <img src="http://lorempixel.com/400/200/"> 
       <img src="http://lorempixel.com/400/200/"> 
      </div> 
     </div> 

    <script src="js/Controller/MainController.js"></script> 
    <script src="js/App.js"></script>  
    </body> 
</html>

コードが

私はapp variable is not definedと[ng:areq] Argument 'MainController' is not a functionを言う私のブラウザのコンソールで次のエラーを受け取る結果。

エラー：

出典

2016-11-27 Ali Jamshidi

私はエラーが発生したファイルを完全に正しいコードで私の答えを編集した：

index.htmlを

<!DOCTYPE html> 
<html> 
    <head> 
     <title>Angular Js</title> 
     <link rel="stylesheet" type="text/css" href="bootstrap.min.css"> 
     <script src="js/angular.js"></script> 
    </head> 
     <body ng-app="myApp"> 
     <div class="header"> 
      <div class="container"> 
       <h1>book end</h1> 
      </div> 
     </div> 

     <div class="Main" ng-controller="MainController"> 
      <div class="container" ng-model="title"> 
       <h1>{{ title }}</h1> 
      </div>  
     </div> 

     <div class="footer"> 
      <div class="container"> 
       <h2>Available for iphone and android</h2> 
       <img src="http://lorempixel.com/400/200/"> 
       <img src="http://lorempixel.com/400/200/"> 
      </div> 
     </div> 
     <!--here you had these two lines inverted--> 
    <script src="js/App.js"></script> <!--first "declare" app--> 
    <script src="js/Controller/MainController.js"></script> <!--then, load modules, controller, etc--> 

    </body> 
</html>

メインコントローラ.js

var app = angular.module('myApp'); //need to locate the module you want to register the controller 

app.controller('MainController',['$scope',function($scope){ 
//it's '$scope', not '$scoope' 
    $scope.title = "top sellers in books"; 
}]);

出典

2016-11-27 22:10:21 lealceldeiro

「Asiel Leal Celdeiro」はanswer.iでこのコードを変更しましたが、まだ動作しません。 –

http://www.rodfile.com/fy7mn2htqnxlこれは私のスクリプトです... –

それはあなたのために働いたのですか？もしそうなら、あなたは答えを「受け入れられた」とマークして解決できますか？ – lealceldeiro

anglejsのコントローラとビューの間の接続

答えて

関連する問題