Error when creating table with angular js

Asked

Viewed 133 times

0

I’m trying to replicate an example I found on the net creating a table with angular js. However this returning me the link error:

http://errors.angularjs.org/1.5.3/ng/areq?p0=table_controller&p1=not%20a%20function%2C%20got%20undefined

 function consoleLog(type) {
  var console = $window.console || {},
      logFn = console[type] || console.log || noop,
      hasApply = false;

  // Note: reading logFn.apply throws an error in IE11 in IE8 document mode.
  // The reason behind this is that console.log has type "object" in IE8...
  try {
    hasApply = !!logFn.apply;
  } catch (e) {}

  if (hasApply) {
    return function() {
      var args = [];
      forEach(arguments, function(arg) {
        args.push(formatError(arg));
      });
      return logFn.apply(console, args); <-- nesta linha o erro é apontado
    };
  }

Never used so I don’t know what to do.

html angularjs

  • You added the file that contains the table_controller in the archive index.html?

  • https://www.dropbox.com/s/37yqqdmi8qzqi3j/teste.html?dl=0

  • I am creating everything in the same file. Just a test to then play in the application.

1 answer

0


Full and working example with Angularjs

<head>
<link data-require="[email protected]" data-semver="3.0.3" rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css" />
<script src="js/teste/angular.min.js"></script>
<script src="js/teste/jquery-1.7.2.min.js"></script>
<link rel="stylesheet" href="style.css" />

<script>
    var app = angular.module("app", []);

    app.controller('table_controller', function($scope) {
        $scope.ordered_columns = [];
        $scope.all_columns = [{
            "title": "name",
            "type": "string",
            "checked": true
        }, {
            "title": "age",
            "type": "number",
            "checked": true
        }, {
            "title": "city",
            "type": "string",
            "checked": true

        }, {
            "title": "state",
            "type": "string",
            "checked": false
        }, {
            "title": "job",
            "type": "string",
            "checked": false
        }];

        // i.e. the rows
        $scope.data = [{
            "name": "aleck",
            "age": 33,
            "city": "Portland",
            "state": "OR",
            "job": "developer"
        }, {
            "name": "john",
            "age": 40,
            "city": "Portland",
            "state": "OR",
            "job": "designer"
        }, {
            "name": "erik",
            "age": 34,
            "city": "Portland",
            "state": "OR",
            "job": "sales"
        }];

        $scope.$watch('all_columns', function() {
            update_columns();
        }, true);

        var update_columns = function() {
            $scope.ordered_columns = [];
            for (var i = 0; i < $scope.all_columns.length; i++) {
                var column = $scope.all_columns[i];
                if (column.checked) {
                    $scope.ordered_columns.push(column);
                }
            }
        };
    });
</script>
</head>

 <body ng-app="app" ng-controller="table_controller">
  <h2>Dynamic table columns with AngularJS!</h2>

  <div class="form-group">
   <div class="col-sm-12">
    <p>Columns</p>
    <div ng-repeat="c in all_columns">
        <label>
            <input type="checkbox" ng-model="c.checked"> {{ c.title }}
        </label>
    </div>
 </div>
 </div>

<table class="table table-striped">
 <tr>
     <th ng-repeat="c in ordered_columns">{{ c.title }}
     </th>
 </tr>
 <tbody>
 <tr ng-repeat="d in data">
    <td ng-repeat="c in ordered_columns">{{ d[c.title] }}</td>
 </tr>
</tbody>
</table>

</body>




</html>
  • 2

    This answer is the solution? or a better description of the code referred to in the question?

  • This is the answer. I couldn’t mark it as settled because I was the one who answered and would have to wait a day for it. It turned out I didn’t schedule it right away.

Browser other questions tagged html angularjs

You are not signed in. Login or sign up in order to post.