Question

这是我的HTML和AngularJs控制器。
当我启动应用时，表单会被ng-repeat ...

填充数据

我的问题是：
当我点击下拉列表时，我想通过此调用和填写表单来调用web api。我打电话给web api并从Api获取数据，但无法填写表格。

<div class="dropdown" ng-app="myapp" ng-controller="PlayerCtrl">
  <button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">Insert
  <span class="caret"></span></button>
  <ul class="dropdown-menu">
    <li><a ng-click="Testmetod('2018')" >2018</li>
    <li><a ng-click="Testmetod('2017')" >2017</li>
    <li><a ng-click="Testmetod('Previous')" >Previous</li>
  </ul>
</div>

    <div class="lisstatistic">
  <section>
      <div class="tbl-headerStat">
        <table cellpadding="0" cellspacing="0" border="1">
          <thead>
            <tr>
              <th style="width :20%;">Pos</th>
              <th style="width :60%;">Player</th>
              <th style="width :20%;">AST</th>
            </tr>
          </thead>
        </table>
      </div>
      <div class="tbl-contentStat">
        <table cellpadding="0" cellspacing="0" border="0">
          <tbody>
            <tr ng-repeat="dataModel in allAsists">
              <td style="width :20%; padding-top: 5px;" >{{dataModel.AstPosition}}</td>
              <td ng-if = "dataModel.Player.Status == 0" style="width :60%; color:red; padding-top: 5px;" >{{dataModel.Player.FullName}}</td>
              <td ng-if = "dataModel.Player.Status == 1" style="width :60%; padding-top: 5px;" >{{dataModel.Player.FullName}}</td>
              <td ng-if = "dataModel.Player.Status == 0" style="width :20%; color:red; padding-top: 5px; text-align:center;" >{{dataModel.Asists | number:0}}</td>
              <td ng-if = "dataModel.Player.Status == 1" style="width :20%; padding-top: 5px; text-align:center;" >{{dataModel.Asists | number:0}}</td>
            </tr>
          </tbody>
        </table>
      </div>
  </section>
</div><div class="lisstatistic">
  <section>
      <div class="tbl-headerStat">
        <table cellpadding="0" cellspacing="0" border="1">
          <thead>
            <tr>
              <th style="width :20%;">Pos</th>
              <th style="width :60%;">Player</th>
              <th style="width :20%;">PTS</th>
            </tr>
          </thead>
        </table>
      </div>
      <div class="tbl-contentStat">
        <table cellpadding="0" cellspacing="0" border="0">
          <tbody>
            <tr ng-repeat="dataModel in allPoints">
              <td style="width :20%; padding-top: 5px;" >{{dataModel.PtsPosition}}</td>
              <td ng-if = "dataModel.Player.Status == 0" style="width :60%; color:red; padding-top: 5px;" >{{dataModel.Player.FullName}}</td>
              <td ng-if = "dataModel.Player.Status == 1" style="width :60%; padding-top: 5px;" >{{dataModel.Player.FullName}}</td>
              <td ng-if = "dataModel.Player.Status == 0" style="width :20%; color:red; padding-top: 5px; text-align:center;" >{{dataModel.Points | number:0}}</td>
              <td ng-if = "dataModel.Player.Status == 1" style="width :20%; padding-top: 5px; text-align:center;" >{{dataModel.Points | number:0}}</td>
            </tr>
          </tbody>
        </table>
      </div>
  </section>
</div>

角度控制器：

app.controller('PlayerCtrl', function ($scope, $http, ApiCall) {

  var result = ApiCall.GetApiCall("nba", "GetRebounds/2000").success(function (data) {
      //var data = $.parseJSON(JSON.parse(data));
      $scope.allRebounds = data;
  });

  $scope.Testmetod = function(year) {
    var result = ApiCall.GetApiCall("nba", "GetAsists" + '/' + year).success(function (data) {
      $scope.allAsists = data;
    });
  };

});

Answer 1

我认为您的问题是您的控制器仅围绕您的PULLDOWN，因此显示该页面的所有代码都超出了控制器的范围，并且无法访问这些值。添加包含您的应用和控制器的div，并使其包含整个HTML块。

<div ng-app="myapp" ng-controller="PlayerCtrl">
  <div class="dropdown">
  </div>
// The rest of your html
</div>

用angularJs填充表格

1 个答案: