Question

按此按钮时，应加载数据，然后在列表中显示。我正在使用ng-click和ng-repeat函数。

在脚本中声明函数的正确方法是什么？我想那就是我失败的地方。

<script>
  var app = angular.module('myApp', [])
  app.controller('myCtrl', ['$scope', function($scope) {

    $scope.count = 0;   
    $scope.myClick = function() {
      $scope.count++;
    };

    $scope.Button = function() {
      $scope.myClickList = studentInfo;
    };

  }]);

    app.value('studentInfo', [
      { id: 1, name: 'Mahedee Hasan', credit: 20, semester: '8th' },
      { id: 3, name: 'Enamul Haque', credit: 15, semester: '7th' },
      { id: 4, name: 'Arefin Billah', credit: 15, semester: '6th' }
    ]);

</script>
<div class="modal-dialog">
  <div class="modal-content">

    <div class="modal-header">
      <h1>RODRIGO</h1>
    </div>

    <div class="modal-body width">
      <div class="group-control" ng-app="myApp" ng-controller="myCtrl">

        <div class="row">
          <div class="col-sm-6">
            <button ng-click="myClick()" class="form-control">Count</button>
            <button ng-click="myClickList()" class="form-control">List</button>
          </div>
          <div class="col-sm-6"align=center>
            <p><h1><b>{{count}}</b></h1></p> 
        </div>
      </div>
      <hr>


      <table class="table">
        <thead>
          <tr>
            <th>Id</th>
            <th>Name</th>
            <th>Credit</th>
            <th>Semester</th>
          </tr>
        </thead>

        <tr ng-repeat="s in studentInfo">
          <td>{{s.id}}
          </td>
          <td>{{s.name}}
          </td>
          <td>{{s.credit}}
          </td>
          <td>{{s.semester}}
          </td>
        </tr>
      </table>


    </div>
  </div>

  <div class="modal-footer">
    <h6>RODRIGO</h6>
  </div>

</div>
</div>

My full example is here

Answer 1

Angularjs value是提供者食谱之一。注册value可通过注入工厂功能访问。在控制器工厂函数中注入studentInfo以获取所需的值。

app.controller('myCtrl', ['$scope', 'studentInfo', //< -- injected here
  function($scope, studentInfo) {

    ......

  }
]);

Forked Codepen

单击并显示Angular中列表中的所有记录

1 个答案: