html在Angular.js中显示变量名称客户端的原因是什么?

时间:2015-09-30 12:23:49

标签: angularjs html5

我的申请确实包含以下数据

     "countries = [
          {locale:'en-US',name:'United States'},
          {locale:'en-GB',name:'United Kingdom'},
          {locale:'en-FR',name:'France'}]"

我写了HTML代码

       <li ng-repeat = "country in countries">
          {{ 'Country: ' + country.name + ', Locale: ' + country.locale }}
       </li>

作为输出显示:

  List of Countries with locale:

home.html文件

<html>   
 <head>
    <title>AngularJS First Application</title>
 </head>
 <script src =   "http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js">
 </script>

 <body>
  <div ng-app = "" ng-init= "countries:[
      {locale:'en-GB',name:'United Kingdom'},
      {locale:'en-US',name:'United State'},
      {locale:'en-FR',name:'France'}]; quantity = 1;cost = 30;" >

  <p>List of Countries with locale:</p>

  <ol>
    <li ng-repeat = "country in countries">
     {{ 'Country: ' + country.name + ', Locale: ' + country.locale }}
    </li>
  </ol>   
 </div> 
 </body>

</html>

为什么它没有在列表中显示国家名称?

1 个答案:

答案 0 :(得分:3)

问题出在您的ng-init ....

你有:

<div ng-app = "" ng-init= "countries:[ 
  {locale:'en-GB',name:'United Kingdom'},
  {locale:'en-US',name:'United State'},
  {locale:'en-FR',name:'France'}]; quantity = 1;cost = 30;" >

应该是:

// changed countries:[
// to: countries=[
<div ng-app = "" ng-init= "countries=[
  {locale:'en-GB',name:'United Kingdom'},
  {locale:'en-US',name:'United State'},
  {locale:'en-FR',name:'France'}]; quantity = 1;cost = 30;" >

正在使用 plnkr