Why AngularJS re-triggers 'link' function of custom directive when model changed?

Question

Plunker: http://plnkr.co/edit/01BRRI?p=preview

Purpose: build a directive that edits data and save back to controller scope.

Code description:

$scope.object is data in controller, I referenced it in directive by using '=' in isolate scope definition. I want to edit it in directive and save it back to controller.

Problem:

Input field would be blurred after any value change. In console you'll find the 'link' function is re-triggered after model value changed. (When model="object.meta[key][index]" in line 41).

If you comment out line 40, 42 and edit 41 to: <editable model="object.meta[key][0]"></editable>

Then everything is right (1. Link function is not re-triggered. 2. Input is not blurred after model change. 3. Controller $scope.object is updated).

I need the nested loop for my data structure, how should I do to fix this?

No, it has problem: when you edit any input field, input blurs. And that's not a DOM event problem mentioned by sss. Input blurs because 'link' was fire again, and it should not be. — Uice Stone
– Uice Stone, Commented Oct 7, 2014 at 5:33

sylwester · Accepted Answer · 2014-10-07 13:38:05Z

1

Input blurs because every time when you updating model ng-repeater re-redndering DOM. To prove that please see that example http://plnkr.co/edit/THJd8z?p=preview I've used there angular 1.3 which support futers called Bind Once more info you can find here http://swirlycheetah.com/native-bind-once-in-angularjs-1-3/

 <section ng-controller="TestCtrl">
    <div ng-repeat="(key, values) in ::object.meta">
      <div ng-repeat="(index, value) in ::values">
        <editable model="object.meta[key][index]"></editable>
      </div>
    </div>
    {{object}}
  </section>

answered Oct 7, 2014 at 13:38

sylwester

16.5k1 gold badge27 silver badges33 bronze badges

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

Collectives™ on Stack Overflow

Why AngularJS re-triggers 'link' function of custom directive when model changed?

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