Databases
StackOverflow2013
Postsdbo
POForm input in a directive with isolated scope: How to set ngModel to the correct scope?
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POForm input in a directive with isolated scope: How to set ngModel to the correct scope?
    text
    copied!<p>I try to display a list of different questions. Each question has its own form inputs. So I wrote a directive that sets up these form inputs. But setting <code>ngModel</code> in the <code>input</code> tags won't update the isolated scope.</p> <p>What I currently have tried:</p> <pre><code>&lt;body ng-app="stepModule" ng-controller="ChallengeCtrl"&gt; &lt;div question step="step"&gt;&lt;/div&gt; &lt;/body&gt; </code></pre> <p>And the JS:</p> <pre><code>angular.module('stepModule', []) .directive('question', function() { return { restrict: 'A', replace: true, scope: { step: '=' }, template: "&lt;form ng-submit=\"submit()\"&gt;\n Step = {{step}}\n &lt;label for=\"question\"&gt;Question&lt;/label&gt;\n &lt;input ngModel=\"step.question\" ng-required=\"true\" name=\"question\" /&gt;\n &lt;label for=\"answer\"&gt;Answer&lt;/label&gt;\n &lt;input ngModel=\"step.answer\" ng-required=\"true\" name=\"answer\" /&gt;\n &lt;input type=\"submit\" value=\"Save (extract out, should save automatically)\" /&gt;\n &lt;/form&gt;", controller: [ "$scope", "$element", "$attrs", function($scope, $element, $attrs) { $scope.submit = function() { console.log($scope.step.question); console.log($scope.step.answer); }; } ] }; }); </code></pre> <p>Here <code>console.log</code> will output the original contents of the <code>$scope.step</code> instead of the new values. <a href="http://plnkr.co/edit/HOquU8ZPt2KNGjSTk2Wo" rel="nofollow">Here a Plunker</a> showing that behavior.</p> <p>Is there a way to get <code>ngModel</code> to use the directives scope? Or am I just just missing something / abusing AngularJS (which wouldn't surprise me the least...)</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload