javascript - angularJs <ng-repeat> 用于加载 json

标签 javascript angularjs json

我尝试在我的示例 SPA 应用程序中加载 json 文件,但出于某种动机,我不明白为什么当我尝试运行我的应用程序时, Controller 不填充我的浏览器选项卡...我是初学者这是我尝试解决这个问题的第二天,但我认为我的解决方案已经失败了。 这是我的代码:

<html ng-app="beerApp">
  <head>
    <meta charset="utf-8">
    <title>Angular.js Example</title>
    <script src="js/libs/angular.js/angular.js" type="text/javascript"></script>
    <script src="beerApp.js" type="text/javascript"></script>
  </head>
  <body ng-controller="beerCtrl">
    Search:<input ng-model="query" type="text"/>
    <table>
      <tr>
        <th><a>Name</a></th>
        <th>Description</th>
        <th><a href="" ng-click="sortField = 'abv'">Abv</a></th>
        <th><a href="" ng-click="sortField = 'name'">Ibu</a></th>

      </tr>
      <tr ng-repeat="beer in beers | filter:query | orderBy:sortField">
        <td>{{beer.name}}</td>
        <td>{{beer.descript}}</td>
        <td>{{beer.abv}}</td>
        <td>{{beer.ibu}}</td>
      </tr>
    </table>
  </body>
</html>
<小时/>

http://plnkr.co/edit/rBlt7tnCN8j0ys2HS7PZ?p=preview

提前致谢 阿尔博 附:完整版本位于 plnkr

最佳答案

您需要在 plnker 中有一个 index.html 选项卡。查看结果here

它正在按您的预期工作!

关于javascript - angularJs <ng-repeat> 用于加载 json,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42372857/

相关文章:

javascript - ng-click 指令中的 ng-repeat

angularjs - Angular CRUD 从模式中删除行

javascript - 在php中检索json数据: json_decode not working?

javascript - 在 Styled Component 中设置 React component props

Javascript 表单生成器

javascript - 不使用 toString() JavaScript 方法构建十进制到十六进制转换器

javascript - 部署在我的服务器上时,Rails 时间总是晚一天

javascript - angular.js 应用程序中的多个 View

python - 字典在传递给函数时显示为 None

javascript - Angular 翻译多个 json 文件