Web sql/Sql Lite and Binding to Row in Angular

Question

This is for a phonegap angular app. I would have thought binding to the db query return, result.rows in my case would be possible but it seems like it is not. The only way I could get this to work was with the commented out code where I manually push the data into an array row by row. Is this the only way?

The actually error received by binding to .rows is: Error: Duplicates in a repeater are not allowed. Repeater: item in items key: undefined:undefined

The service:

// only portion of code shown
query: function (q) {
        var d = $q.defer();
        var db = this.getDb();

        db.transaction(function (t) {
            t.executeSql(q, [], function (tx, results) {
                d.resolve(results);
            }, function (err) {
                d.reject(err);
            });

        }, function (err) {
            d.reject(err);
        }
        );

        return d.promise;
     }

The controller is like this:

  Sql.query('select * from DEMO').then(function (data) {
                console.log(data);
                //$scope.items = [];

                //for (i = 0, l = data.rows.length; i < l; i++) {
                    //$scope.items.push(data.rows.item(i));
                //}

                $scope.items = data.rows;  // this errors out
                $scope.$safeApply();
            });

The repeater is just a simple:

<div ng-repeat='item in items'>{{item.id}} {{item.data}}</div>

Answer 1

Based on the error message it looks like you have more than one undefined item in the data.rows array.

Your working code uses data.rows.item(i) is that creating an new empty object instead of undefined? Try changing data.rows.item(i) to data.rows[i] in your working code does that break as well?

Assuming you are using angular 1.1.5 here are some options:

• Use your current workaround
• Downgrade to 1.1.4 or to the current stable 1.0.7. I think 1.1.4 will work based on a broken version with 1.1.5 and a working version with 1.1.4.
• Remove any duplicate undefined rows from data.rows

---

Note: For others having a similar type of error Angular generates a $$hashKey to objects when doing an ng-repeat. This error indicates the same object is in the array (with the same $$hashKey) and is not allowed in 1.1.5 (and later?).

See this blog post and google groups post for more info. Also this pull request looks related so I'm not sure if this behavior is intended going forward though it appears to have been fixed in the past.