2017-01-09 26 views
0

我試圖在下面的angularjs代碼中使用scope而不是ng-init,但沒有任何描述爲什麼?用範圍變量替換ng-init不起作用

<!doctype html> 
    <html ng-app="myApp" ng-controller="myCtrl"> 
    <head> 
    <title>Bookshop - Your Online Bookshop</title> 
    <meta charset="UTF-8"> 
    <link rel="stylesheet" href="http://www.w3schools.com/lib/w3.css"> 
    </head> 
    <body> 

    <div class="container"> 
      <h2>Your Online Bookshop</h2> 
      <ul class="unstyled"> 
        <li ng-repeat="book in books"> 
        {{book}} 
        </li> 
    </ul> 
    </div> 

    <div class="container"> 
      <h2>Your Online Bookshop</h2> 
      <ul class="unstyled"> 
        <li ng-repeat="book in books_author"> 
          <span>{{book.name}} written by {{book.author}}</span> 
        </li> 
      </ul> 
    </div> 

    <script> 
    var app = angular.module('myApp', []); 
    app.controller('myCtrl', function($scope) { 
    $scope.books = ['Effective Java','Year without Pants','Confessions of public speaker','JavaScript Good Parts']; 
    $scope.books_author = [{'name': 'Effective Java', 'author':'Joshua Bloch'},{'name': 'Year without Pants', 'author':'Scott Berkun'},{ 'name':'Confessions of public speaker','author':'Scott Berkun'},{'name':'JavaScript Good Parts','author':'Douglas Crockford'}]; 
    }); 
    </script>  
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"></script> 
    </body> 
    </html> 

回答

1

它適用於我,但您必須在使用它之前加載角度。因此,更改爲:

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"></script> 
<script> 
    var app = angular.module('myApp', []); 
    app.controller('myCtrl', function($scope) { 
    $scope.books = ['Effective Java','Year without Pants','Confessions of public speaker','JavaScript Good Parts']; 
    $scope.books_author = [{'name': 'Effective Java', 'author':'Joshua Bloch'},{'name': 'Year without Pants', 'author':'Scott Berkun'},{ 'name':'Confessions of public speaker','author':'Scott Berkun'},{'name':'JavaScript Good Parts','author':'Douglas Crockford'}]; 
    }); 
    </script>  
1

的代碼是好的,只是招行,當你有AngularJS:

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"></script> 

在你的自定義腳本使用前,並將努力!