2016-02-17 3 views
1

Я не могу объяснить (вероятно, я слепой !!), почему я не могу получить значение из $scope с помощью ng-model в следующем коде:Угловая не модель связывания данных

var appModule = angular.module('publicApp',[]); 
 

 

 
appModule.controller("changePasswordController", 
 
\t function($scope, $location, mainService) { 
 
\t \t 
 
\t \t $scope.sendChangePassword = function(){ 
 

 
\t \t \t alert('password: ' + $scope.password + '\n' + 
 
\t \t \t \t \t 'password_rpt: ' + $scope.password_rpt + '\n' + 
 
\t \t \t \t \t 'user: ' + $scope.user + '\n' + 
 
\t \t \t \t \t 'token: ' + $scope.token + '\n' 
 
\t \t \t \t \t); 
 
\t \t } 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.20/angular.min.js"></script> 
 

 
<body ng-app="publicApp" style="padding: 50px"> 
 
    <div class="row-fluid"> 
 
     <form name="form" novalidate="novalidate"> 
 
      <span ng-controller="changePasswordController"> 
 
       <input type="text" name="user" id="user" ng-model="user" value="[email protected]" 
 
         style="display: none;"/> 
 
       
 
       <input type="hidden" name="token" id="token" ng-model="token" 
 
         value="eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJleHAiOjE0NTU3MTg2NjEsInVzZXJJZCI6ImZyYW5jZXNjby5kaXBhc3F1YW50b25pb0BnbWFpbC5jb20iLCJyb2xlcyI6WyJub25lIl19.Uzw2GuPhxagfeEESL9WF3RAC7upZFudJpag6Jjl2KQk"/> 
 
       
 
       <div class="input-group input-sm"> 
 
        <input class="form-control" type="password" required id="password" name="password" ng-model="password" 
 
          placeholder="inserisci password"/> 
 
       </div> 
 
       <div class="input-group input-sm"> 
 
        <input type="password" class="form-control" id="password_rpt" name="password_rpt" 
 
          ng-model="password_rpt" password-match="password" required placeholder="ripeti password"/> 
 
       </div> 
 
       <div> 
 
        <input type="button" 
 
          class="btn btn-primary btn-default" value="Change Password" 
 
          ng-click="sendChangePassword()"/> 
 
       </div> 
 
      </span> 
 
     </form> 
 
    </div> 
 
</body>

В Мой код запуска я могу получить только $scope.password значение, остальные переменные не определены!

Это то, что предупреждение печати: Alert print

+0

Возможная дубликат [Угловая js init ng-model из значений по умолчанию] (http://stackoverflow.com/questions/13769732/angular-js-init-ng-model-from-default-values) –

ответ

1

Вы должны инициализировать значения по умолчанию, как показано ниже в вашем контроллере:

var appModule = angular.module('publicApp', []); 
 

 

 
appModule.controller("changePasswordController", 
 
    function($scope, $location) { 
 

 
    $scope.user = "[email protected]"; 
 
    $scope.token = "eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJleHAiOjE0NTU3MTg2NjEsInVzZXJJZCI6ImZyYW5jZXNjby5kaXBhc3F1YW50b25pb0BnbWFpbC5jb20iLCJyb2xlcyI6WyJub25lIl19.Uzw2GuPhxagfeEESL9WF3RAC7upZFudJpag6Jjl2KQk"; 
 

 
    $scope.sendChangePassword = function() { 
 

 
     alert('password: ' + $scope.password + '\n' + 
 
     'password_rpt: ' + $scope.password_rpt + '\n' + 
 
     'user: ' + $scope.user + '\n' + 
 
     'token: ' + $scope.token + '\n' 
 
    ); 
 
    } 
 
    });
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.20/angular.min.js"></script> 
 

 
<body ng-app="publicApp" style="padding: 50px"> 
 
    <div class="row-fluid"> 
 
     <form name="form" novalidate="novalidate"> 
 
      <span ng-controller="changePasswordController"> 
 
       <div class="input-group input-sm"> 
 
        <input class="form-control" type="password" required id="password" name="password" ng-model="password" 
 
          placeholder="inserisci password"/> 
 
       </div> 
 
       <div class="input-group input-sm"> 
 
        <input type="password" class="form-control" id="password_rpt" name="password_rpt" 
 
          ng-model="password_rpt" password-match="password" required placeholder="ripeti password"/> 
 
       </div> 
 
       <div> 
 
        <input type="button" class="btn btn-primary btn-default" value="Change Password" 
 
          ng-click="sendChangePassword()"/> 
 
       </div> 
 
      </span> 
 
     </form> 
 
    </div> 
 
</body>

Если user и token генерируется и визуализируется сервером в форме HTML, тогда вам следует избегать его. Причиной ошибки является использование ng-model с атрибутом value в Угловом.

В случае, если вы обязаны инициализировать значения из token & user, то вместо того, чтобы назначить их в скрытых полях ввода, вы должны сделать их в качестве глобальной переменной, вероятно, в head секции, как это:

<head> 
    <script> 
     window.globalData = { 
       user: "[email protected]", 
       token: "your-long-token" 
     }; 
    </script> 
</head> 

Теперь, читать эти переменные в контроллере, используя $window (угловой обертку window объекта:

$scope.user = $window.globalData.user; 
$scope.token = $window.globalData.token; 
+1

Я работаю, спасибо –

3

Ваш модуль не будет создан правильный путь. Попробуйте изменить это:

var appModule = angular.module('publicApp'); 

в этом:

var appModule = angular.module('publicApp', []); 
+0

angular.module ('приложение' , []) - создать новый модуль без какой-либо зависимости от модуля. angular.module ('app') предназначен для извлечения существующего модуля, чье имя является приложением. –

+0

Да, это правда, но я не могу предположить, что OP уже создал модуль раньше. – Peter

+0

Извините, это ошибка копирования/вставки, в моем запущенном коде он работает нормально, и я вижу предупреждение. –

Смежные вопросы