Search code examples
javascriptangularjssyntaxng-class

angularjs syntax error with ng-class


I'm new to angularjs (and programming in general) and am having trouble. I'm following along with a tutorial and trying to create a table and highlight a specific row when clicked. My console is logging an error, which when clicked, takes me here: Syntax Error: Token 'undefined' is at column {2} of the expression [{3}] starting at [{4}]. The original error in the console was: [$parse:syntax] http://errors.angularjs.org/1.2.23/$parse/syntax?p0=undefined&p1=is%20unexpected%2C%20expecting%20%5B%7D%5D&p2=null&p3=%7Bselected%3A%20%24index%3D%3DselectedRow&p4=%7Bselected%3A%20%24index%3D%3DselectedRow

app.js

app.controller('RestaurantTableController',['$scope', function ($scope){
    $scope.selectedRow = {};
    $scope.directory= [{name:'The Handsome Heifer', cuisine:'BBQ'},
    {name: "Green's Green Greens", cuisine:'Salads'},
    {name:'House of Fine Fish', cuisine: 'Seafood'}];

    $scope.selectRestaurant=function(row){
        console.log('restaurant test');
        $scope.selectedRow = row;
    };
}]);

index.html:

<table ng-controller="RestaurantTableController">
        <tr ng-repeat="restaurant in directory" ng-click ='selectRestaurant($index)' ng-class='{selected: $index==selectedRow'>
            <td>{{restaurant.name}}</td>
            <td>{{restaurant.cuisine}}</td>
        </tr>
    </table>

Solution

  • Looks like you've missed out the closing brace in the ng-class value:

    ng-class='{selected: $index==selectedRow}'