首页 > 解决方案 > Angularjs无法读取未定义的属性“****”

问题描述

ng-repeat 遇到问题,因此它给了我一个无法读取属性 'companyID' 的未定义错误。尽管这一直在使用以前版本的 angular. 在我的代码中找不到错误。

控制台给了我这些错误,但我可以看到我从我的 API 中得到了正确的响应。 控制台日志图像

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);
  });
});

标签: javascripthtmlangularjs

解决方案


检查控制台错误,意外令牌:这会破坏导致该 companyID 错误的脚本。


推荐阅读