2016-07-13 4 views
0

ここでは、Angularチュートリアルのコードスニペットをhtmlタグでng-appディレクティブを呼び出すのではなく、spanタグを作成して呼び出します。なぜJavaScriptが表示されないのですか?ご協力いただきありがとうございます!!角度サンプルのフォローアップ

var phonecatApp = angular.module('phoneCatApp', []); 
 
phonecatApp.controller('PhoneListController', function PhoneListController($scope) { 
 
    $scope.phones = [{ 
 
     name: 'Nexus S', 
 
     snippet: 'Fast just got faster with Nexus S.' 
 
    }, { 
 
     name: 'Motorola XOOM™ with Wi-Fi', 
 
     snippet: 'The Next, Next Generation tablet.' 
 
    }, { 
 
     name: 'MOTOROLA XOOM™', 
 
     snippet: 'The Next, Next Generation tablet.' 
 
    } 
 
    ]; 
 
});
<!doctype html> 
 
<html> 
 
<head> 
 
    <meta charset="utf-8"> 
 
    <title>My HTML File</title> 
 
    <link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css"/> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
    <script src="app.js"></script> 
 
</head> 
 
<span ng-app="phoneCatApp"> 
 
<body ng-controller="PhoneListController"> 
 
<p>Nothing here {{'yet' + '!'}}</p> 
 

 
<p>1 + 2 = {{1 + 2}}</p> 
 
<ul> 
 
    <li ng-repeat="phone in phones"> 
 
     <span> 
 
      {{phone.name}}</span> 
 

 
     <p>{{phone.snippet}}</p> 
 

 
    </li> 
 
</ul> 
 

 
</body> 
 
    </span> 
 
</html>

+0

ラップ 'span'と' div'と使用 ''内部p'を<span>を好きではないと思いますng-repeat'をdivに入れます – uzaif

答えて

1

私はHTML<body>

var phonecatApp = angular.module('phoneCatApp', []); 
 
phonecatApp.controller('PhoneListController', function PhoneListController($scope) { 
 
    $scope.phones = [{ 
 
    name: 'Nexus S', 
 
    snippet: 'Fast just got faster with Nexus S.' 
 
    }, { 
 
    name: 'Motorola XOOM™ with Wi-Fi', 
 
    snippet: 'The Next, Next Generation tablet.' 
 
    }, { 
 
    name: 'MOTOROLA XOOM™', 
 
    snippet: 'The Next, Next Generation tablet.' 
 
    }]; 
 
});
<!doctype html> 
 
<html> 
 

 
<head> 
 
    <meta charset="utf-8"> 
 
    <title>My HTML File</title> 
 
    <link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css" /> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
</head> 
 

 
<body ng-app="phoneCatApp" ng-controller="PhoneListController"> 
 
    <p>Nothing here {{'yet' + '!'}}</p> 
 

 
    <p>1 + 2 = {{1 + 2}}</p> 
 
    <ul> 
 
    <li ng-repeat="phone in phones"> 
 
     <span>{{phone.name}}</span> 
 
     <p>{{phone.snippet}}</p> 
 
    </li> 
 
    </ul> 
 
</body> 
 
</html>

+0

はい、m ur正しい、私が体の内側にスパンを設定して、それは動作します。他の角度のディレクティブが動作し、spanがbodyタグの外側にあるときにng-repeatではありません。ありがとう、 –

+0

私は本当に確かではありませんが、とにかく体の外側にスパンを置くべきではありません。 – Icycool

関連する問題