Как связать с использованием ng-модели в угловых js

Я только начал использовать угловые js, и я играл с директивой ng-model, но я не могу понять, что я делаю неправильно. Я хочу, чтобы введенное значение электронной почты отображалось в теге h1, когда я печатаю. в значительной степени я не получаю ничего шоу в теге h1, когда я печатаю.Как связать с использованием ng-модели в угловых js

<body ng-app="starter"> 
    <ion-pane> 
     <ion-content style="margin-top: 163px"> 
      <div ng-controller="loginController"> 
       <form action=""> 
        <div class="row"> 
         <div class="col col-50 col-offset-25"> 
          <div class="card"> 
           <div class="item item-text-wrap"> 
            <div class="list"> 
             <label class="item item-input"> 
              <i class="icon ion-email placeholder  icon"></i><input type="email" placeholder="Email" ng-model="email" /> 
              <h1>{{email}}</h1> 
             </label> 
            <label class="item item-input"> 
             <i class="icon ion-locked placeholder-icon"></i><input type="text" placeholder="Password" /> 
            </label> 
            <br/> 
            <button class="button button-full button-positive">Clock Me In</button> 
           </div> 
          </div> 
         </div> 
        </div> 
       </div> 
      </form> 
     </div> 
    </ion-content> 
</ion-pane> 
</body>

это мой Javascript

var app = angular.module('starter', ['ionic']) 

app.controller('loginController', function($scope) 
{ 

})

источник

2015-06-05 user3862830

необходимо передать значение от контроллера, например $ scope.email = "[email protected]", после чего оно появится на вашей странице. – lalitpatadiya

Обратите внимание, что если вы назначили 'type =" email ", результат будет отображаться только в том случае, если поле является допустимым –

lol. Это была проблема с типом электронной почты. Я изменил свой код, чтобы набрать текст, и он сработал. благодаря – user3862830

Ваши изменения не отображаются на экране, потому что в то время как вы печатаете письмо является недействительным. Недопустимые значения отражаются до $scope как null, поэтому ничего не показывать.

Как указано в комментариях, вы можете изменить его type="text". Поскольку вы удалили проверку, вы увидите текст как на экране, так и на вашем $scope, однако вы пожертвуете валидацией.

Если вы все еще хотите использовать проверку подлинности электронной почты и хотите увидеть его на экране/$scope, вы можете использовать ng-model-options, как описано here.

Используя ng-model-options, вы можете разрешить хранить недопустимые значения в $scope.

Просьба добавить ng-model-options="{allowInvalid: true}" к вашему вводу type="email".

источник

2015-06-05 13:43:10

Как связать с использованием ng-модели в угловых js

ответ

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