FAQ
I am trying to convert a simple little search app from a PHP endpoint to
Firebase.

I have converted the controller over and it is working to display the data
from firebase.

OLD PHP Endpoint

app.controller('InstantSearchController', ['$scope', '$http', function($scope, $http) {
     $http.get('inc/api.php').success(function(itemData) {
         $scope.items = itemData;
     });}]);

New Firebase Endpoint

app.controller('InstantSearchController', ['$scope', '$firebase', function($scope, $firebase) {
     var medRef = new Firebase("https://dazzling-fire-####.firebaseio.com/");
     $scope.items = $firebase(medRef);}]);

But I am not 100% sure how to swap the app.filter over to use the firebase
data.

Here is what it was with the PHP End Point

app.filter('searchFor', function(){

   return function(arr, searchString){
     if(!searchString){
       return arr;
     }
     var result = [];
     searchString = searchString.toLowerCase();
     angular.forEach(arr, function(item){
       if(item.english.toLowerCase().indexOf(searchString) !== -1){
         result.push(item);
       }
       if(item.spain.toLowerCase().indexOf(searchString) !== -1){
         result.push(item);
       }
       if(item.germany.toLowerCase().indexOf(searchString) !== -1){
         result.push(item);
       }
       if(item.france.toLowerCase().indexOf(searchString) !== -1){
         result.push(item);
       }
       if(item.philippines.toLowerCase().indexOf(searchString) !== -1){
         result.push(item);
       }
       });
     return result;
   };
});

And this is what I was thinking "should" work but it doesn't, from doing
some reading and watching of some tutorials i thought that i needed to
switch item with id

app.filter('searchFor', function(){

   return function(arr, searchString){
     if(!searchString){
       return arr;
     }
     var result = [];
     searchString = searchString.toLowerCase();
     return function(arr, searchString){
       if(!searchString){
         return arr;
       }
       var result = [];
       searchString = searchString.toLowerCase();
       angular.forEach(arr, function(id){
         if(id.english.toLowerCase().indexOf(searchString) !== -1){
           result.push(item);
         }
         if(id.spain.toLowerCase().indexOf(searchString) !== -1){
           result.push(item);
         }
         if(id.germany.toLowerCase().indexOf(searchString) !== -1){
           result.push(item);
         }
         if(id.france.toLowerCase().indexOf(searchString) !== -1){
           result.push(item);
         }
         if(id.philippines.toLowerCase().indexOf(searchString) !== -1){
           result.push(item);
         }
         });
       return result;
     };});

Any help pointing me in the right direction would be great i am really
trying to learn this AngularJS/Firebase stuff!

--
You received this message because you are subscribed to the Google Groups "Firebase + AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email to firebase-angular+unsubscribe@googlegroups.com.
To post to this group, send email to firebase-angular@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/firebase-angular/80cd0de7-212d-477c-8960-8c30527cd462%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

Search Discussions

  • Jacob Wenger at Jul 3, 2014 at 1:18 am
    Hey Travis,

    Glad you are giving AngularFire a shot! Thanks for all the code samples you
    provided. I do have a question for you about how you are using the searchFor
    filter though. Could you provide the code from your HTML file which uses
    it? Are you are using it to filter $scope.items?

    Working with arrays in Firebase (and AngularFire) is always a bit tricky
    <https://www.firebase.com/blog/2014-04-28-best-practices-arrays-in-firebase.html>,
    but we are adding explicit support for arrays with our upcoming AngularFire
    0.8 release <https://github.com/firebase/angularFire/tree/release_0.8> (you
    can find the docs here
    <https://github.com/firebase/angularFire/blob/gh-pages/documentation.md>).
    This should save you a lot of code in your situation but I think we can get
    this working on the current version of AngularFire as well.

    I'll provide you with an actual code sample next time once I get some more
    info from you.

    Jacob
    On Wednesday, July 2, 2014 11:07:30 AM UTC-7, Travis Terry wrote:

    I am trying to convert a simple little search app from a PHP endpoint to
    Firebase.

    I have converted the controller over and it is working to display the data
    from firebase.

    OLD PHP Endpoint

    app.controller('InstantSearchController', ['$scope', '$http', function($scope, $http) {
    $http.get('inc/api.php').success(function(itemData) {
    $scope.items = itemData;
    });}]);

    New Firebase Endpoint

    app.controller('InstantSearchController', ['$scope', '$firebase', function($scope, $firebase) {
    var medRef = new Firebase("https://dazzling-fire-####.firebaseio.com/");
    $scope.items = $firebase(medRef);}]);

    But I am not 100% sure how to swap the app.filter over to use the firebase
    data.

    Here is what it was with the PHP End Point

    app.filter('searchFor', function(){

    return function(arr, searchString){
    if(!searchString){
    return arr;
    }
    var result = [];
    searchString = searchString.toLowerCase();
    angular.forEach(arr, function(item){
    if(item.english.toLowerCase().indexOf(searchString) !== -1){
    result.push(item);
    }
    if(item.spain.toLowerCase().indexOf(searchString) !== -1){
    result.push(item);
    }
    if(item.germany.toLowerCase().indexOf(searchString) !== -1){
    result.push(item);
    }
    if(item.france.toLowerCase().indexOf(searchString) !== -1){
    result.push(item);
    }
    if(item.philippines.toLowerCase().indexOf(searchString) !== -1){
    result.push(item);
    }
    });
    return result;
    };
    });

    And this is what I was thinking "should" work but it doesn't, from doing
    some reading and watching of some tutorials i thought that i needed to
    switch item with id

    app.filter('searchFor', function(){

    return function(arr, searchString){
    if(!searchString){
    return arr;
    }
    var result = [];
    searchString = searchString.toLowerCase();
    return function(arr, searchString){
    if(!searchString){
    return arr;
    }
    var result = [];
    searchString = searchString.toLowerCase();
    angular.forEach(arr, function(id){
    if(id.english.toLowerCase().indexOf(searchString) !== -1){
    result.push(item);
    }
    if(id.spain.toLowerCase().indexOf(searchString) !== -1){
    result.push(item);
    }
    if(id.germany.toLowerCase().indexOf(searchString) !== -1){
    result.push(item);
    }
    if(id.france.toLowerCase().indexOf(searchString) !== -1){
    result.push(item);
    }
    if(id.philippines.toLowerCase().indexOf(searchString) !== -1){
    result.push(item);
    }
    });
    return result;
    };});

    Any help pointing me in the right direction would be great i am really
    trying to learn this AngularJS/Firebase stuff!
    --
    You received this message because you are subscribed to the Google Groups "Firebase + AngularJS" group.
    To unsubscribe from this group and stop receiving emails from it, send an email to firebase-angular+unsubscribe@googlegroups.com.
    To post to this group, send email to firebase-angular@googlegroups.com.
    To view this discussion on the web visit https://groups.google.com/d/msgid/firebase-angular/f5e89ff0-a6c9-4737-ae72-24942c3a3b87%40googlegroups.com.
    For more options, visit https://groups.google.com/d/optout.
  • Michael Wulf at Jul 3, 2014 at 3:26 pm
    Hi Travis,

    Can you explain why you're not using the typical Angular search approach
    here?

    <input ng-model="searchText" type="text" />
    ...
    <li ng-repeat="item in items | orderByPriority | filter:searchText" />

    I don't see anything in your filter that requires custom filters to be
    created.

    Additionally, when this question appeared on StackOverflow, didn't it
    mention a JavaScript error?

    Cheers,

    On Wed, Jul 2, 2014 at 6:17 PM, Jacob Wenger wrote:

    Hey Travis,

    Glad you are giving AngularFire a shot! Thanks for all the code samples
    you provided. I do have a question for you about how you are using the
    searchFor filter though. Could you provide the code from your HTML file
    which uses it? Are you are using it to filter $scope.items?

    Working with arrays in Firebase (and AngularFire) is always a bit tricky
    <https://www.firebase.com/blog/2014-04-28-best-practices-arrays-in-firebase.html>,
    but we are adding explicit support for arrays with our upcoming
    AngularFire 0.8 release
    <https://github.com/firebase/angularFire/tree/release_0.8> (you can find
    the docs here
    <https://github.com/firebase/angularFire/blob/gh-pages/documentation.md>).
    This should save you a lot of code in your situation but I think we can get
    this working on the current version of AngularFire as well.

    I'll provide you with an actual code sample next time once I get some more
    info from you.

    Jacob

    On Wednesday, July 2, 2014 11:07:30 AM UTC-7, Travis Terry wrote:

    I am trying to convert a simple little search app from a PHP endpoint to
    Firebase.

    I have converted the controller over and it is working to display the
    data from firebase.

    OLD PHP Endpoint

    app.controller('InstantSearchController', ['$scope', '$http', function($scope, $http) {
    $http.get('inc/api.php').success(function(itemData) {
    $scope.items = itemData;
    });}]);

    New Firebase Endpoint

    app.controller('InstantSearchController', ['$scope', '$firebase', function($scope, $firebase) {
    var medRef = new Firebase("https://dazzling-fire-####.firebaseio.com/");
    $scope.items = $firebase(medRef);}]);

    But I am not 100% sure how to swap the app.filter over to use the
    firebase data.

    Here is what it was with the PHP End Point

    app.filter('searchFor', function(){

    return function(arr, searchString){
    if(!searchString){
    return arr;
    }
    var result = [];
    searchString = searchString.toLowerCase();
    angular.forEach(arr, function(item){
    if(item.english.toLowerCase().indexOf(searchString) !== -1){
    result.push(item);
    }
    if(item.spain.toLowerCase().indexOf(searchString) !== -1){
    result.push(item);
    }
    if(item.germany.toLowerCase().indexOf(searchString) !== -1){
    result.push(item);
    }
    if(item.france.toLowerCase().indexOf(searchString) !== -1){
    result.push(item);
    }
    if(item.philippines.toLowerCase().indexOf(searchString) !== -1){
    result.push(item);
    }
    });
    return result;
    };
    });

    And this is what I was thinking "should" work but it doesn't, from doing
    some reading and watching of some tutorials i thought that i needed to
    switch item with id

    app.filter('searchFor', function(){

    return function(arr, searchString){
    if(!searchString){
    return arr;
    }
    var result = [];
    searchString = searchString.toLowerCase();
    return function(arr, searchString){
    if(!searchString){
    return arr;
    }
    var result = [];
    searchString = searchString.toLowerCase();
    angular.forEach(arr, function(id){
    if(id.english.toLowerCase().indexOf(searchString) !== -1){
    result.push(item);
    }
    if(id.spain.toLowerCase().indexOf(searchString) !== -1){
    result.push(item);
    }
    if(id.germany.toLowerCase().indexOf(searchString) !== -1){
    result.push(item);
    }
    if(id.france.toLowerCase().indexOf(searchString) !== -1){
    result.push(item);
    }
    if(id.philippines.toLowerCase().indexOf(searchString) !== -1){
    result.push(item);
    }
    });
    return result;
    };});

    Any help pointing me in the right direction would be great i am really
    trying to learn this AngularJS/Firebase stuff!
    --
    You received this message because you are subscribed to the Google Groups
    "Firebase + AngularJS" group.
    To unsubscribe from this group and stop receiving emails from it, send an
    email to firebase-angular+unsubscribe@googlegroups.com.
    To post to this group, send email to firebase-angular@googlegroups.com.
    To view this discussion on the web visit
    https://groups.google.com/d/msgid/firebase-angular/f5e89ff0-a6c9-4737-ae72-24942c3a3b87%40googlegroups.com
    <https://groups.google.com/d/msgid/firebase-angular/f5e89ff0-a6c9-4737-ae72-24942c3a3b87%40googlegroups.com?utm_medium=email&utm_source=footer>
    .

    For more options, visit https://groups.google.com/d/optout.
    --
    You received this message because you are subscribed to the Google Groups "Firebase + AngularJS" group.
    To unsubscribe from this group and stop receiving emails from it, send an email to firebase-angular+unsubscribe@googlegroups.com.
    To post to this group, send email to firebase-angular@googlegroups.com.
    To view this discussion on the web visit https://groups.google.com/d/msgid/firebase-angular/CAFHX4%3DoGqrHU8fR%3DcYr1-idBQYMww7CqhtmhPS3y8QX_7JzVDw%40mail.gmail.com.
    For more options, visit https://groups.google.com/d/optout.

Related Discussions

Discussion Navigation
viewthread | post
Discussion Overview
groupfirebase-angular @
postedJul 2, '14 at 6:25p
activeJul 3, '14 at 3:26p
posts3
users3

People

Translate

site design / logo © 2021 Grokbase