plunkr: http://plnkr.co/edit/aXjMqhZxI7ME8wQJOLpA?p=preview
On Friday, April 18, 2014 4:06:13 PM UTC-7, abe wrote:
>
> I am attempting to write a directive that will sort arbitrary data at an
> arbitrary place in my application. Let us say I have the following code
> (based on actual real code, sort function and some of the complexity for
> simplicity)
>
> angular.module('test', []);
> angular.module('test').controller('wrapperController',['$scope',
> function(scope){
> scope.data = {}
> scope.data.rows = [{name: 'foo'}, {name: 'bar'}, {name: 'bazz'}]
> scope.data.columns = [{name: 'Name', sortBy: 'name'}]
> }]);
> angular.module('test').directive('grid', [function(){
> return {
> restrict: 'A',
> templateUrl: 'grid.html',
> scope: {
> grid: '='
> }
> }
> }]);
> angular.module('test').directive('sortable', [function(){
> return {
> restrict: 'A',
> scope: {
> sortableCollection: '=',
> sortableKey: '&'
> },
> compile: function(el, at, transclude){
> if(at['ng-click']){
> el.attr('ng-click', el.attr('ng-click')+';sortFunction()')
> }else{
> el.attr('ng-click', 'sortFunction();')
> }
> return(function(scope, element, attrs){
> scope.sortableKey = scope.sortableKey();
> scope.sortFunction = function(){
> alert(" I AM IN UR FUCNTION SORTING UR D00dZ!!1");
> }
> });
> }
> }
> }]);
>
> And the following html:
>
> <body ng-app='test'>
> <div ng-controller='wrapperController'>
> <div grid='data'></grid>
> </div>
> </body>
>
> and (in `grid.html`):
>
> <div>
> <table>
> <thead>
> <tr>
> <td ng-repeat='column in grid.columns'>
> <div sortable sortable-collection='grid'
> sortable-key='column.sortBy'>{{column.name}}</div>
> </td>
> </tr>
> </thead>
> <tbody>
> <tr ng-repeat='row in grid.rows'>
> <td ng-repeat='cell in grid.columns'>
> {{row.name}}
> </td>
> </tr>
> </tbody>
> </table>
> </div>
>
> Inspecting the HTML shows that the `ng-click` is correctly populating,
> however when the heading is clicked the function never fires. Why is that?
> Is there a way to get this kind of behaviour?
>
--
You received this message because you are subscribed to the Google Groups
"AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.
