2017-01-09 5 views
0

以下のanglejsコードで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> 

をカスタムスクリプトにそれを使用する前に、そして動作します!

関連する問題