0

I am facing a problem... In my app I created directive that creates form fields. my idea is to pass a json object to directive with custom options for inputs, but I am expiriencing a problem with ng-model applying. Firstly here is my directive code:

.directive('formSelect', function () {
    return {
        transclude: true,
        replace: true,
        scope:{},
        template: '<label class="acxm-dropdown {{opts.cssClass}}"><span>{{opts.labelText}}</span><select ng-transclude=""></select></label>',
        restrict: 'E',
        link: function (scope, element, attrs) {
            scope.opts = scope.$eval(attrs.opts);
        }
    };
  }
)

in scope.opts I would like to have an subObject with custom attributes that will be added to input, so my directive will be called: 

<form-select opts="{labelText: 'active only', cssClass: 'acxm-p-horizontal acxm-u-inline active-filter', customAttrs: {'ng-model': 'onlyActive'}}"></form-select>

I tried to add ng-model attr to input dynamically but than it didn't work, I also tried to pass only the name of ng-model attr but I had also some issues... Is it possible to make it work? or not? Thanks for your help...

Adrian Wajs
  • 137
  • 1
  • 3
  • 11
  • I managed to find a resolution: http://stackoverflow.com/questions/14115701/angularjs-create-a-directive-that-uses-ng-model – Adrian Wajs Dec 13 '13 at 12:56

1 Answers1

0

You can pull your ng-model out of the opts= portion, but still reference it in your directive. See the answer here as an example that I believe is close to what you're wanting to accomplish.

$watch ngModel from inside directive using isolate scope

Community
  • 1
  • 1
Darryl
  • 1,451
  • 1
  • 12
  • 19
  • Yes it is close but still i don't get quite idea of it... It observs the change of value of this field but how can I make it work with my filtering? This is what I want to achive: I have for example checkbox that should filter users in table that are active previously it was done by: ng-model="activeOnly" and than I added to table row filter:onlyActive while creating table... How can I handle this? – Adrian Wajs Dec 11 '13 at 11:47
  • I don't understand. Can you setup a jsFiddle. – Darryl Dec 11 '13 at 15:51
  • ok I have something simillar to this: http://jsfiddle.net/V9e9M/1/ but based on table and there are more data :). I want to create a directive for input that will create the input with some opts passed as a parameter to the directive... – Adrian Wajs Dec 11 '13 at 16:20
  • That's just a simple ng-repeat with a filter. It really doesn't help. Can you setup a fiddle with your attempt at the solution with the directive you have in mind. Then I can fork it and try to get a working solution. – Darryl Dec 11 '13 at 20:25
  • ok this is almost like what I am having now http://jsfiddle.net/HB7LU/1301/ you should have a better view on it now... Directive is compiled etc ng-model attr is on input but model dosn't work... – Adrian Wajs Dec 12 '13 at 10:29
  • I believe that the compile function does not receive a scope argument. See the first answer on this page: http://stackoverflow.com/questions/12164138/what-is-the-difference-between-compile-and-link-function-in-angularjs – Darryl Dec 13 '13 at 06:24