2016-11-30 73 views
0

我是Angular的新用戶,想要做一個練習,並且結果不顯示在瀏覽器上。Angular沒有顯示我的記錄

(function() { 
 

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

 
    app.controller('BusContorller', function() { 
 
    this.busbarnd = basname; 
 
    }); 
 

 
    var basname = { 
 
    name: 'tata', 
 
    yearprod: 2000, 
 
    } 
 

 
})();
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<!-- container --> 
 
<div class="container" ng-app="bus"> 
 
    <!-- row --> 
 
    <div class="row"> 
 
    <div class="col-xs-12 col-sm-12 col-md-12"> 
 
     <!-- Call controller --> 
 
     <div ng-controller="BusContorller as bus"> 
 
     <p>Bus name : {{bus.busbarnd.name}}</p> 
 
     </div> 
 
     <!--// Call controller --> 
 
    </div> 
 
    </div> 
 
    <!-- // row end --> 
 
</div> 
 
<!-- // container -->

請讓我知道我做錯了。我在想我在撥打控制器時犯了錯誤。

+0

你需要看看在您的控制檯,看看你做了什麼錯誤。你這樣做後,在這裏發佈錯誤。 – Lexi

+2

您的代碼正在工作,我剛剛添加了Angular庫 – Satpal

+0

您的代碼正在工作,但您不應該使用這種方式進行數據綁定。你應該使用'$ scope'服務 – Charleshaa

回答

1

嘗試像下面

<!DOCTYPE html> 
<html ng-app="bus"> 

    <head> 
    <meta charset="utf-8" /> 
    <title>AngularJS Plunker</title> 
    <script>document.write('<base href="' + document.location + '" />');</script> 
    <link rel="stylesheet" href="style.css" /> 
    <script data-require="[email protected]" src="https://code.angularjs.org/1.4.12/angular.js" data-semver="1.4.9"></script> 
    <script src="app.js"></script> 
    </head> 
<script> 
    var app = angular.module('bus',[]); 

     app.controller('BusContorller', function($scope){ 
      $scope.busbarnd = $scope.basname; 

     $scope.basname = { 
      name: 'tata', 
      yearprod: 2000, 
     } 
     }); 



    </script> 

    <body ng-controller="BusContorller"> 
    <div ng-controller="BusContorller as bus"> 
     <p>Bus name : {{busbarnd.name}}</p> 
     </div> 
    </body> 

</html>