Fatal编程技术网
  • javascript/
  • Javascript ng repeat在AngularJS 1.6中不起作用

Javascript ng repeat在AngularJS 1.6中不起作用

javascript angularjs

Javascript ng repeat在AngularJS 1.6中不起作用,javascript,angularjs,angularjs-1.6,Javascript,Angularjs,Angularjs 1.6,我是AngularJS的新手，我使用的是1.6版，我从数据库中获取信息，它可以工作，但当我想要访问JSON信息时，它不会显示数据 这是我的密码 <div class="row m-t-50"> {{ autos |json }} <div class="col-md-12"> <table class="table table-striped"> <thead>

我是AngularJS的新手，我使用的是1.6版，我从数据库中获取信息，它可以工作，但当我想要访问JSON信息时，它不会显示数据

这是我的密码

<div class="row m-t-50">
    {{ autos |json }}
    <div class="col-md-12">
        <table class="table table-striped">
            <thead>
                <tr>
                    <th>Marca</th>
                    <th>Modelo</th>
                    <th>Color</th>
                    <th>Año</th>
                    <th>Precio</th>
                </tr>
            </thead>
            <tbody>
                <tr ng-repeat="auto in autos">
                    <td>{{ auto.marca }}</td>
                    <td>{{ auto.modelo }}</td>
                    <td>{{ auto.color }}</td>
                    <td>{{ auto.anio }}</td>
                    <td>{{ auto.precio }}</td>
                </tr>
            </tbody>
        </table>
    </div>
</div>
但是表格是空的，我做错了什么？

在
上使用了
ng repeat
。根据给定数据，应在
autos.data
数组上应用重复

使用

并在视图中按原样使用它

<tr ng-repeat="auto in autos">



autos
是对请求的响应。响应包含
数据
属性，用于访问从服务器发送的实际响应。要访问响应数据，请使用
response.data

其他属性包括状态–
状态
，
标题
，
配置
和
状态文本
，您应该使用
自动数据

演示

var-app=angular.module（'todoApp'，[]）；
app.controller（“dobController”、[“$scope”，
职能（$范围）{
$scope.autos={“data”：[{“id”：“1”，“marca”：“TOYOTA”，“modelo”：“VC2017”，“color”：“Verde”，“anio”：“2017”，“precio”：“250345”}，{“id”：“2”，“marca”：“NISSAN”，“modelo”：“NS2017”，“color”：“Azul”，“anio”：“2016”，“precio”：“540000”}），“status”：“200”，“config”：{“method”：“GET”，“transformRequest”：[null]，“transformResponse”：[null]，“transformResponse”：[null]，“jsonpCallbackParam”：“callback”，“url”：“php/obtener autos.php”，“headers”：{“Accept”：“application/json，text/plain，*/*”}}，，“statusText”：“OK”}；
}
])；

样品
{{autos | json}}
马卡
摩洛
颜色
阿诺
普里西奥
{{auto.marca}}
{{auto.modelo}}
{{auto.color}}
{{auto.anio}}
{{auto.precio}}


{{d.marca}}
Angular版本1.6.1中的工作plnkr在此使用此示例

你的html

<table class="table table-striped">
        <thead>
            <tr>
                <th>Marca</th>
                <th>Modelo</th>
                <th>Color</th>
                <th>Año</th>
                <th>Precio</th>
            </tr>
        </thead>
        <tbody>
            <tr ng-repeat="auto in autos">
                <td>{{ auto.marca }}</td>
                <td>{{ auto.modelo }}</td>
                <td>{{ auto.color }}</td>
                <td>{{ auto.anio }}</td>
                <td>{{ auto.precio }}</td>
            </tr>
        </tbody>
    </table>
不要忘记插入这一行JSON.parse（response.data）
版本1.6.1需要。

首先，您需要将其从json转换为object。显示控制器代码。谢谢！现在它可以工作了，但它是关于angularjs版本的？很久以前，在另一个版本1.5中，我想我看到了一个示例，其中的数据不是there@Fixer不。这和角度无关。据我记忆所及，t他的格式来自AngularJS的第一个版本。我现在明白了，如果我只想返回没有这些属性的信息呢？有区别吗？@Fixer在controller中，分配
$scope.autos=response.data；
@Fixer在您的响应对象中，当您在autos中说ng repet=“auto”时，您还有其他对象要处理“您正在迭代整个对象。要访问内部对象，您需要提到autos.data/autos.config，以便访问它们。 
$scope.autos = response.data;

<tr ng-repeat="auto in autos">

  <body ng-controller="MyCtrl">
      <div>
        <div ng-repeat="d in data"> {{ d.marca }}</div>
      </div>
  </body>

<table class="table table-striped">
        <thead>
            <tr>
                <th>Marca</th>
                <th>Modelo</th>
                <th>Color</th>
                <th>Año</th>
                <th>Precio</th>
            </tr>
        </thead>
        <tbody>
            <tr ng-repeat="auto in autos">
                <td>{{ auto.marca }}</td>
                <td>{{ auto.modelo }}</td>
                <td>{{ auto.color }}</td>
                <td>{{ auto.anio }}</td>
                <td>{{ auto.precio }}</td>
            </tr>
        </tbody>
    </table>

 $http.get("your url").then(function (response) {
            $scope.cars= JSON.parse(response.data);
        });