I am using ng-table for displaying a grid in angularjs. I want to use the ng-click event of the default pagination of ng-table table.I have tried using the method $scope.params.count() and $scope.params() which is on the ng-click of the pagination but it is not working.Is there any method that can be used to customize the click event of default pagination of ng-table
Related
I am using uib pagination for my project. I managed to get it to scroll to top when i clicked on the link. But how i can prevent scroll to top when i click on the '...'
I have attached the image of my pagination and html.
IMAGE
<ul ng-show="$ctrl.projects.length > 10" boundary-link-numbers="true" rotate="false" max-size="4" previous-text="‹" next-text="›" ng-change="$ctrl.pageChanged()" uib-pagination total-items="$ctrl.projects.length" ng-model="$ctrl.currentPage" items-per-page="$ctrl.projectSize"></ul>
Thank you
ng-model contains the value of the clicked element
I wanted to place a Typeahead directive on a Modal dialog. The problem is that when typeahead show it's list of possible matches it is behind modal-footer div. I played with append-to-body then the whole list is behind the modal dialog. Also played with append-to no luck. Any suggestion?
The solution was to add this attribute to html:
typeahead-append-to-body="true"
and in the css file this:
.dropdown-menu {
z-index:9999;
}
Now the Typeahead displays correctly over the modal dialog.
Is there a way to make the UI Bootstrap datepicker popup component appear above the controll instead of under?
In an angularjs service, I am adding the HTML for an accordion-group to the DOM of an accordion element. What results is the display of the accordion-group as if it were a panel - no title bar, no collapse behavior.
I'm sure it is because the accordion gets initialized before the content is added. The jQueryUI accordion has a refresh method for such occasions, but not sure how to get the angualrui accordion to recognize the new accordion group.
hope the following steps help :
get the reference of the element where you want to add the accordion
HTML : <div id = "myAccordion"> </div>
Controller : var parent = angular.element("#myAccordion");
Compile your accordion template and attach it to the parent
Controller: var accordion = $compile("<div accordion> </div>")($scope);
parent.append(accordion);
but this is a work around you should ideally have a directive to do DOM manipulation , perhaps you are coding with jquery in mind.
I've built a directive <playlist> which calls my custom service to return and then display a list of videos. So far so good. However, I don't want this directive to render and call my API until the user clicks on a link elsewhere on the page.
How can I have a link outside of the directive trigger the rendering of the <playlist> item? I looked for some sort of onShow event to no avail.
You can use the ng-if directive to keep your directive out of the DOM until the link is clicked. So your HTML would looks something like this:
<div ng-if="showPlaylist">
<playlist />
</div>
Then you would just set showPlaylist to true when you want it to show/render.
I was able to figure this out based on dnc253's feedback.
Toggle Playlist
<div ng-if="showPlaylist != undefined">
<playlist ng-show="showPlaylist"></playlist>
</div>
On initial page load <playlist> is hidden and not rendered. Clicking the link renders <playlist>. Subsequent clicks toggle the ng-show attribute and so the scope is not reset.