title: $scope doesn't picks up string from form input - AngularJS, JS
body: <p>I am trying to implement Change Password feature in MVC (Rest server) application from the User Control Panel but because of some strange reason I can't scope values from form input.</p>
  
  <p>My html form:</p>
  
  <pre><code>&lt;accordion-group heading="Change password" is-open="changePasswordStatus.open" style="cursor: pointer"&gt;
      &lt;div&gt;
          &lt;div&gt;
              &lt;form class="form-horizontal" role="form"&gt;
                  &lt;form-row model="newPassword" name="New: " size="col-sm-8"&gt;&lt;/form-row&gt;
                  &lt;form-row model="repeatedNewPassword" name="Repeat: " size="col-sm-8"&gt;&lt;/form-row&gt;
                  &lt;form-row model="currentPassword" name="Current: " size="col-sm-8"&gt;&lt;/form-row&gt;
                  &lt;br&gt;
              &lt;/form&gt;
          &lt;/div&gt;
          &lt;div&gt;
          &lt;button class="btn btn-default btn-sm" ng-click="changePassword()"&gt;Save&lt;/button&gt;
          &lt;button class="btn btn-warning btn-sm" ng-click="changePasswordStatus.open = !changePasswordStatus.open"&gt;Cancel&lt;/button&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;/accordion-group&gt;
  </code></pre>
  
  <p>My formRow.html:</p>
  
  <pre><code>&lt;div class="form-group"&gt;
      &lt;label for="inputText3" class="col-sm-2 control-label"&gt;{{name}}&lt;/label&gt;
      &lt;div class="{{size}}"&gt;
          &lt;input type="{{type}}" class="form-control" data-ng-model="model"&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>My formRow.js:</p>
  
  <pre><code>collectionsApp.directive('formRow', function(){
      return {
          restrict: 'E',
          replace: true,
          scope: {
              model: '=',
              name: '@',
              size: '@',
              type: '@'
          },
          templateUrl: '/directives/formRow.html',
          link: function(scope, attrs, element) {
  
          }
      }
  });
  </code></pre>
  
  <p>My userController:</p>
  
  <pre><code>$scope.changePassword = function() {
      if ($scope.newPassword === $scope.repeatedNewPassword) {
          userService.changePassword($scope.newPassword, $scope.currentPassword);
      } else {
              $scope.alerts.push({
                  msg : 'Passwords do not match!'
              })
      }
  }
  </code></pre>
  
  <p>And when I enter values in inputs and place breakpoints and trigger changePassword() in debug i get:
  <img src="https://i.stack.imgur.com/3Fjm2.png" alt="enter image description here"></p>
  
  <p>If condition has passed with value of true because they are both undefined.</p>