i have a program that sorts words based on Authors, which is an array. i am recieving the $parse:syntax error in the console; however, the program is executing and returning the right results. i'm not sure what is causing this problem. I am sorting the words using other attributes like Tags and Books; however, this console error is only being presented by some instances in these arrays.

this is how it looks: view

the error is as follows:

angular.js:13236 Error: [$parse:syntax] Syntax Error: Token 'Baggins' is an unexpected token at column 7 of the expression [Frodo Baggins] starting at [Baggins].
http://errors.angularjs.org/1.5.0/$parse/syntax?p0=Baggins&p1=is%20an%20unexpected%20token&p2=7&p3=Frodo%20Baggins&p4=Baggins
    at http://localhost:8080/node_modules/angular/angular.js:68:12
    at Object.AST.throwError (http://localhost:8080/node_modules/angular/angular.js:13816:11)
    at Object.AST.ast (http://localhost:8080/node_modules/angular/angular.js:13586:12)
    at Object.ASTCompiler.compile (http://localhost:8080/node_modules/angular/angular.js:14040:31)
    at Parser.parse (http://localhost:8080/node_modules/angular/angular.js:14927:29)
    at $parse (http://localhost:8080/node_modules/angular/angular.js:15035:39)
    at http://localhost:8080/node_modules/angular/angular.js:20463:17
    at Array.map (native)
    at processPredicates (http://localhost:8080/node_modules/angular/angular.js:20452:26)
    at http://localhost:8080/node_modules/angular/angular.js:20416:22(anonymous function) @ angular.js:13236(anonymous function) @ angular.js:9965Scope.$digest @ angular.js:16682Scope.$apply @ angular.js:16928clickListener @ angular-material.js:14066defaultHandlerWrapper @ angular.js:3398eventHandler @ angular.js:3386
angular.js:13236 Error: [$parse:syntax] Syntax Error: Token 'Baggins' is an unexpected token at column 7 of the expression [Frodo Baggins] starting at [Baggins].
http://errors.angularjs.org/1.5.0/$parse/syntax?p0=Baggins&p1=is%20an%20unexpected%20token&p2=7&p3=Frodo%20Baggins&p4=Baggins
    at http://localhost:8080/node_modules/angular/angular.js:68:12
    at Object.AST.throwError (http://localhost:8080/node_modules/angular/angular.js:13816:11)
    at Object.AST.ast (http://localhost:8080/node_modules/angular/angular.js:13586:12)
    at Object.ASTCompiler.compile (http://localhost:8080/node_modules/angular/angular.js:14040:31)
    at Parser.parse (http://localhost:8080/node_modules/angular/angular.js:14927:29)
    at $parse (http://localhost:8080/node_modules/angular/angular.js:15035:39)
    at http://localhost:8080/node_modules/angular/angular.js:20463:17
    at Array.map (native)
    at processPredicates (http://localhost:8080/node_modules/angular/angular.js:20452:26)
    at http://localhost:8080/node_modules/angular/angular.js:20416:22(anonymous function) @ angular.js:13236(anonymous function) @ angular.js:9965Scope.$digest @ angular.js:16682processQueue @ angular-material.js:1316(anonymous function) @ angular.js:18744completeOutstandingRequest @ angular.js:5804(anonymous function) @ angular.js:6081

the JSON is as follows

{
"expression": "to the day",
"meaning": "",
"example": "it's been four years to the day.",
"pronunciation": "",
"notes": "",
"meta": {
"book": ["There and back again"],
"author": ["Frodo Baggins"],
"tags": ["middle earth"]}
},

the code in the view is as follows:

<md-input-container>
        <label>Books</label>
        <md-select ng-model="book">
            <md-option ng-repeat="book in books | orderBy: book" value="{{ book }}"> <!-- books here refers to a newly defined array that stores only one instance of all the books against the 'book' property on each object/word -->
                {{ book }} 
            </md-option>
        </md-select>
    </md-input-container>

the code in the controller is as follows:

function getBooks(classifieds) {

        var books = [];
        angular.forEach(classifieds, function(item) {
            if (item.meta) {    
                angular.forEach(item.meta.book, function(b) {

                    books.push(b);
                });
            }

        });

        return _.uniq(books);

    }
share|improve this question
    
install chrome and try you page with it. in the debug you can click on error, it will open a page on the angular web site. this page will explain the error a little bit – AlainIb Mar 24 '16 at 6:33
1  
Please write your complete JS Code – Hassan Tariq Mar 24 '16 at 6:33
    
$scope.books = getBooks(classifieds); this calls the getBooks function shown above – Nosail Mar 24 '16 at 6:45

Simple answer I think - the order by should read: | orderBy:'book' https://docs.angularjs.org/api/ng/filter/orderBy

share|improve this answer
    
oh yes.. i added it within the quotes. <md-option ng-repeat="book in books | orderBy: 'book'" value="{{ book }}"> no runtime error. however, the values in the Tag array are not being sorted alphabeticaly now. strangely, they were before i added it within quotes. – Nosail Mar 24 '16 at 17:28
    
book not included within quotes -- i was getting the aforementioned runtime error; however, the values were being ordered by/sorted alphabetically in the book list || book included within quotes -- i am not getting the aforementioned runtime error; however, the values now are not being ordered by/sorted alphabetically. – Nosail Mar 24 '16 at 17:35
    
in my first comment to your response i meant -- however, the values in the BOOK array (not Tag) are not being orderedby/sorted alphabeticaly now. strangely, they were before i added it within quotes. – Nosail Mar 24 '16 at 17:46
    
it works now. i figured primitives don't sort by default, but one can pass in a function. Changed the orderBy to orderBy: 'toString()'.<md-option ng-repeat="book in books | orderBy: 'toString()'" value="{{ book }}"> – Nosail Mar 25 '16 at 7:10

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.