ng-repeat

78 views
Skip to first unread message

Jake K.

unread,
Dec 16, 2013, 5:00:15 PM12/16/13
to ang...@googlegroups.com

Hello,

I have a colorbox dialog and inside it
I have an input ( search bar )

As soon as there is user input in the search bar, 
it performs an api call that fetches search results.

These search results are displayed into the colorbox using ng-repeat.

It works fine for the first time but when I execute in the second time ( and on )
I get repeat elements showing inside ng-repeat ( even if I reset the array to 0 )

E.g.

search input: hello world

ng-repeat

hello
hello world
hello world 2
...

but after closing the dialog box and reopening it, I get

hello
hello world
hello world 2
hello
hello
hello
hello world
hello world
hello world
hello world 2
hello world 2
hello world 2

Thanks

PS: As I mentioned earlier I do reset the size of the array back to 0 once the dialog box is closed.
I also watch the size of the array constantly, and in the previous example I get 3 ( not 12 )

Is there sth going on with ng-repeat?


Also, If you have better suggestions on how to write a search input bar, please let me know.

 

Sander Elias

unread,
Dec 17, 2013, 2:28:32 AM12/17/13
to ang...@googlegroups.com
Hi Jake,

Nope, nothing going on with ng-repeat. Probably something going on with your code, but that is really hard to tell without you showing it.

If you build an plunk or a fiddle illustrating your problem, most of us are quite happy to take a look at it.

Regards
Sander

Jake K.

unread,
Dec 17, 2013, 2:48:29 AM12/17/13
to ang...@googlegroups.com
Hello,

Thanks for your reply.

Actually I solved the problem with the help of another coder.

The solution was to provide a promise.resolve to the http to abort further http calls

So this is what I roughly did:

var canceler = $q.defer();

http({
   url: 'url-to-rest-api'
   timeout: canceler    // this stops further http calls 
}).success( successcallback )

//....

canceler.resolve()


Are you familiar with this?

Now, I'd like to reverse the cancellation. How can I do that?

The Idea is to build a search bar that uses a restful service which constantly returns results as I type in the search bar. The idea is to stop the calls, show the results and once shown, allow the user to make more searches ( a gif image would indicate when the results are fully loaded and when its ok to type in more words to continue searching)

Thank you





2013/12/16 Sander Elias <sande...@gmail.com>

--
You received this message because you are subscribed to a topic in the Google Groups "AngularJS" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/ObTIhhAAxzk/unsubscribe.
To unsubscribe from this group and all its topics, send an email to angular+u...@googlegroups.com.
To post to this group, send email to ang...@googlegroups.com.
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/groups/opt_out.



--
JAKE KWON +1 (604) 655 3109
email: jyk...@gmail.com

Sander Elias

unread,
Dec 17, 2013, 6:20:36 AM12/17/13
to ang...@googlegroups.com
Hi Jake,

Yes, just start a new request. you can't resume a broken off one.
I would monitor user input, break of the old request upon new input, and restart a new one, with the new input. 
I only would show it to the user after he has stopped typing, for at least 500ms..

Regards
Sander

Francisc Romano

unread,
Dec 18, 2013, 4:41:50 AM12/18/13
to ang...@googlegroups.com
Hi Jake,

You have a small error in your code and the HTTP calls aren't actually aborted.
The `timeout` property should be `canceler.promise` instead of just `canceler`.

Have fun.
Reply all
Reply to author
Forward
0 new messages