AngularJS: Assign to scope value although attribute not set on element

Question

In my directive I create an isolate scope and assign to the ngModel in code. Here's my isolate scope:

scope: {
  ngModel: '=',
  value: "=",
  placeholder: "@"
}

Inside the link function I assign to scope.ngModel. That works fine if the ng-model attribute is set on the element, but when it's not it raises an error.

Error: Non-assignable model expression: undefined

What's the preferred way to check if the attribute exists? Do I have to do this explicitly with element.hasAttribute or am I doing it completely wrong?

You can't have optional two-way-binding (=). You could however optionally ?^require the model, and have it injected to your link-function as the 4th parameter. — Yoshi
– Yoshi, Commented May 12, 2013 at 14:23

joakimbl · Accepted Answer · 2013-05-12 14:31:59Z

1

If the ngModel-attribute is optional in your directive you have to check if it exist before you assign any value to the scope variable, or Angular will raise an error. I'd use if( attrs.ngModel ){...} or element.attrs('ngModel') to check if it's present.

With ngModel you also have the option of using the ngModelController in your directive link function. You do this by require:'^ngModel' (^ if it's optional) and the ngModelController will be available as the fourth argument in your link controller (link:function(scope,element,attrs,ngModelController){ ... }).

answered May 12, 2013 at 14:31

joakimbl

18.1k5 gold badges57 silver badges53 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

AngularJS: Assign to scope value although attribute not set on element

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related