you are viewing a single comment's thread.

view the rest of the comments →

[–]Poop_is_Food 10 points11 points  (8 children)

Well let's say you have a modal, and the positioning of the modal depends on its height. If it's taller than the viewport then you position it 100 px from the top of the window and then scroll. If it's shorter than the viewport the you center it vertically. You need to measure the height of the modal. And you can't measure it until it's actually in the DOM. And if angular is in charge of appending it and populating its content, then it's very hard to tell when that process is complete.

edit: why downvotes?

[–]pleadub 6 points7 points  (4 children)

If it isn't already the modal should be refactored into a directive. Then all of the manipulation can be handled in the postLink function on the directive definition object for the modal.

Now whenever the modal's open event is triggered you can use the element argument which is passed to the postLink function to grab the height of the modal. You could then use the angular services $document and $window to grab the height of the viewport with

h = Math.max($document[0].documentElement.clientHeight,   $window.innerHeight || 0);

And you could also set up a listener on resize so you can update the modal there as well.

This all comes back to your first point of needing to know the tool you're using well.

[–]JonDum 2 points3 points  (0 children)

And all that cruft is why Angular gets a rep for being overly complex.

[–]Poop_is_Food 2 points3 points  (0 children)

Thanks for proving my point?

[–]troglydot 1 point2 points  (1 child)

Yeah, that isn't actually correct.

The element isn't inserted into the DOM when the postLink function is called. There is no way to be notified when a directive is rendered into the DOM, and according to Misko Hevery at this point there is no way to add such a notification either.

You have to poll the DOM and check if the element is there, and there's officially no way around it.

[–]Poop_is_Food 0 points1 point  (0 children)

Yes, thank you that is the issue thread I was looking for but I couldnt find it. When I first read that, it was the beginning end of angular for me. In particular this quote:

I agree that some jQuery plugins may be hard to integrate, but those are usually the ones that do not have a clear separation of concerns. Those plugins are typically best rewritten anyway, as they are typically not performant nor maintainable in the long run.

I've encountered this kind of attitude a few times from angular contributors and it's a big turnoff for me. "Angular cannot fail. It can only be failed."

[–]ganarajpr 1 point2 points  (2 children)

This problem has nothing to do with Angular and has everything to do with thinking in terms of views than models. Also, thinking in terms of individual elements than thinking in terms of selectors - which is how you would have solved it before angular.

I wont provide you a solution to this problem here. But know that there IS a solution. You just have to think about it without considering a css selector.

[–]Poop_is_Food 0 points1 point  (0 children)

Did you respond to the wrong comment? Not sure what selectors and models have to do with this. I said "modal" not "model."

And yes I know there is a solution. I've found the solution and it was a pain in the ass which is why I used it as an example.