Question

使用ng-repeat遇到麻烦，因此它使我无法读取未定义错误的属性“ companyID”。尽管这已经在angular的早期版本上进行了。在我的代码中找不到错误。

控制台给了我这些错误，但是我可以看到我从我的API得到了正确的响应。 console log image

HTML代码：

<div ng-app="myApp" ng-controller="companyCtrl">
<div class="row">
    <div class="col-sm-6 col-lg-8 col-md-12 col-xl-8">
          <table class="table table-striped table-hover">
            <thead class="thead-dark">
              <th>Company ID</th>
              <th>Company Name</th>
              <th>Address</th>
              <th>City</th>
              <th>Country</th>
              <th>Owners</th>
              <th>Phone number</th>
              <th>Email</th>
              <th></th>
            </thead>
            <tr ng-repeat="company in companies" >
              <td>{{company.companyID}}</td>
              <td>{{company.companyName}}</td>
              <td>{{company.address}}</td>
              <td>{{company.city}}</td>
              <td>{{company.country}}</td>
              <td>{{company.owners}}</td>
              <td>{{company.phoneNumber}}</td>
              <td>{{company.email}}</td>

              <td><button class="btn" name="_method" ng-click="DeleteData($index)">Delete</button></td>
            </tr>
          </table>

        </div>
        <div class="col-sm-6 col-lg-4 col-md-12 col-xl-3">
          <div ng-app="myApp" ng-controller="companyCtrl">
            <form>
              <div class="form-group">
                <label for="companyID">Company ID</label>
                <input type="text" class="form-control" id="companyID" ng-model="companyID" required>
              </div>
              <div class="form-group">
                <label for="companyName">Company Name</label>
                <input type="text" class="form-control" id="companyName" ng-model="companyName" required>
              </div>
              <div class="form-group">
                <label for="address">Address</label>
                <input type="text" class="form-control" id="address" ng-model="address" required>
              </div>

              <div class="form-group">
                <label for="city">City</label>
                <input type="text" class="form-control" id="city" ng-model="city" required>
              </div>
              <div class="form-group">
                <label for="country">Country</label>
                <input type="text" class="form-control" id="country" ng-model="country" required>
              </div>
              <div class="form-group">
                <label for="owners">Owners</label>
                <input type="text" class="form-control" id="owners" ng-model="owners" required>
              </div>
              <div class="form-group">
                <label for="phoneNumber">Phone number</label>
                <input type="number" class="form-control" id="phoneNumber" ng-model="phoneNumber" optional>
              </div>
              <div class="form-group">
                <label for="email">Email</label>
                <input type="email" class="form-control" id="email" ng-model="email" optional>
              </div>
                <button type="submit" id="popupContainer" class="btn" name="_method" ng-click="PostData($event)">Add</button>
            </form>

          </div>

        </div>
    </div>
  <button ng-click="Refresh()">Refresh test</button>
</div>

脚本：

myApp.controller('companyCtrl',function($scope,  $http, $window) {
   $http.get("https://***.herokuapp.com/api/v1/companies").then(function (response) {
    $scope.companies = response.data;
    console.log("Data response: ");
    console.log(response.data);
  });
});

Answer 1

检查控制台错误，意外令牌：破坏脚本，导致该companyID错误。

Answer 2

您可以处理null检查以防止错误抛出

<td ng-if="company && company.companyID">{{company.companyID}}</td>

所有这些属性。

Answer 3

也许页面正在尝试在解决诺言之前渲染ng-repeat。尝试将ng-if放在表格中或tr中，看看是否可以解决问题。

db.collection.aggregate(

    // Pipeline
    [
        // Stage 1
        {
            $addFields: {
                "date": {
                   "$dateFromParts": {
                   "year": "$year",
                   "month": {"$toInt": "$month"}
                 }
                }
            }
        },

        // Stage 2
        {
            $match: {
             "date": {
                 "$gte": ISODate("2017-07-01T00:00:00.000Z"),
                 "$lte": ISODate("2018-04-30T00:00:00.000Z")
               }
            }
        },

    ]
);

Answer 4

您可以尝试定义$ scope.companies = [];在$ http.get

之前的脚本代码中

Angularjs无法读取未定义的属性“ ****”

4 个答案: