Dap Dap - 17 days ago 5
AngularJS Question

How to pass a scope variable to a native angular directive's parameter in angular 1.5?

So I'm working with Angular 1.5. I'm trying to accomplish something quite trivial. Apologies if this sounds a bit off as backend is more my fortè. What I'm trying to do is pass a scope variable to a native angular directive. Is this a known issue?

angular.module('CompDirective',
['ngMaterial']
).directive('pitchButton', function(){
return {
restrict: 'E',
scope: {
campaign: '='
},
templateUrl: '/static/html/compensation.html',
link: function(scope, element, attrs){
scope.minCompensation = 100;
}
)


and in my html.

<input
type="number"
ng-model='fields.monetary_compensation'
name="compensation" required
ng-pattern='/^[1-9]+[0-9]*$/'
placeholder="Compensation"
min="minCompensation"
></input>


Echoing out minCompensation works as expected but the param min with minCompensation is not validating which leads me to believe that there is an issue with the input directive's min param being able to recognize scope variables.

Answer

min is not in the documentation, so I'm guessing it doesn't accept an angular expression.

You need to interpolate the value as in <input ... min="{{minCompensation}}" />

Alternatively, you can create your own ng-min and ng-max directives.

Comments