TableView не отображать данные в угловых JS - PullRequest
0 голосов
/ 25 апреля 2018

Привет, я новичок в Angular-Js и пытаюсь отобразить данные массива в табличном представлении, используя приведенный ниже код, но данные не отображают .

Какую ошибку я совершил?

Я перешел по ссылке ниже для выполнения моего требования:

https://lorenzofox3.github.io/smart-table-website/

index.htmlk:

<!DOCTYPE html>
<html>

  <head>
    <link data-require="bootstrap-css@3.2.0" data-semver="3.2.0" rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" />
    <script data-require="angular.js@1.2.21" data-semver="1.2.21" src="https://code.angularjs.org/1.2.21/angular.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="app.js"></script>
    <script src="smart-table.js"></script>
    <script src="IrInfiniteScrollPlugin.js"></script>
  </head>

  <body>

  <div ng-app="myApp" ng-controller="safeCtrl">

  <table st-table="rowCollection" class="table table-striped">
    <thead>
    <tr>
        <th>first name</th>
        <th>last name</th>
        <th>birth date</th>
        <th>balance</th>
        <th>email</th>
    </tr>
    </thead>
    <tbody>
    <tr ng-repeat="row in rowCollection">
        <td>{{row.firstName | uppercase}}</td>
        <td>{{row.lastName}}</td>
        <td>{{row.birthDate | date}}</td>
        <td>{{row.balance | currency}}</td>
        <td>
            <button class="btn btn-sm" popover-placement="top" popover="{{row.email}}" type="button">
                <i class="glyphicon glyphicon-eye-open"></i>
            </button>
            <a ng-href="mailto:{{row.email}}">email</a></td>
        <td>
            <button type="button" ng-click="removeRow(row)" class="btn btn-sm btn-danger">
                <i class="glyphicon glyphicon-remove-circle">
                </i>
            </button>
        </td>
    </tr>
    </tbody>
   </table>

  </div>
 </body>
 </html>

app.js:

angular.module('myApp', []).controller('safeCtrl', function($scope) {

    scope.rowCollection = [
        {firstName: 'Laurent', lastName: 'Renard', birthDate: new Date('1987-05-21'), balance: 102, email: 'whatever@gmail.com'},
        {firstName: 'Blandine', lastName: 'Faivre', birthDate: new Date('1987-04-25'), balance: -2323.22, email: 'oufblandou@gmail.com'},
        {firstName: 'Francoise', lastName: 'Frere', birthDate: new Date('1955-08-27'), balance: 42343, email: 'raymondef@gmail.com'}
    ];
});

1 Ответ

0 голосов
/ 25 апреля 2018

Я думаю, вы пропустили инъекцию $scope ИЛИ она не введена правильно. Попробуйте приведенный ниже код контроллера, возможно, это вам поможет.

angular.module('myApp', []).controller('safeCtrl',['$scope', function(scope) {
    scope.rowCollection = [
        {firstName: 'Laurent', lastName: 'Renard', birthDate: new Date('1987-05-21'), balance: 102, email: 'whatever@gmail.com'},
        {firstName: 'Blandine', lastName: 'Faivre', birthDate: new Date('1987-04-25'), balance: -2323.22, email: 'oufblandou@gmail.com'},
        {firstName: 'Francoise', lastName: 'Frere', birthDate: new Date('1955-08-27'), balance: 42343, email: 'raymondef@gmail.com'}
    ];
}]);

ПРИМЕЧАНИЕ. Надеемся, что вы выполнили первое требование этого библиотека. Т.е. первым делом нужно добавить модуль angular.module ('myApp', ['smart-table']) для вашего углового приложения.

Надеюсь, это поможет решить!

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...