새 로그인 정보 등록 Angular JS

안녕하세요, 저는 새로운 사용자가 자신의 이름과 암호를 등록하여 사용자 배열에 넣도록하고 싶습니다. 그것은 평범한 자바 스크립트에서 작동하지만, 어떤 이유로 내 Angular JS는 그렇지 않습니다.새 로그인 정보 등록 Angular JS

HERES 각도 JS는

var users = [ 
    { 
     username: 'Regie', 
     password: 'Tano' 
    }, 
    { 
     username: 'Jacob', 
     password: 'Minshall' 
    }, 
    { 
     username: 'Greg', 
     password: 'Mayer' 
    } 
    ] 

app.controller("logIn", function($scope){ 


    $scope.log = function(){ 

    //Get Values of Inputs for username and password 
    var username= document.getElementById('username').value 
    var password = document.getElementById('password').value 

    //Loop through users to check if username and password are correct. 
    for(i = 0; i < users.length; i++){ 
     if(username == users[i].username && password == users[i].password){ 
     alert('That Username or Password is already taken') 
     } 
    } 
    } 
}); 

//REGISTER USER********** 
app.controller("registerUser", function($scope){ 

$scope.place = function(){ 

    var registerName = document.getElementById('registerName').value 
    var registerPass = document.getElementById('registerPass').value 
    var newUser = { 
    username: registerName, 
    password: registerPass 
    } 

users.push(newUser) 
console.log(users) 

} 
});

다음은 대신 NG-모델로 지시어를 사용하여 직접 DOM에 접근해서는 안 각도에서 HTML

<body ng-app='myApp'> 

    <form id='form' ng-controller='logIn'> 
     <h1>Log In</h1> 
     <input type="text" id="username" placeholder="Enter Username" /> 
     <input type="password" id="password"placeholder="Enter Password" /> 
     <button id="button" type="button" ng-click='log()'>Click This</button> 
    </form> 

    <form id='form2' ng-controller='registerUser'> 
    <h1>Register</h1> 
    <input type='text' id='registerName' placeholder='Enter Username'/> 
    <input type='password' id='registerPass' placeholder='Enter Password'/> 
    <button id='registerButton' type='button' ng-click='place()'>Register</button> 
    </form>

출처

2017-05-01 Regie Tano

시작하려면 ...하지 않는 각도 세계 : document.getElementById를 ('registerName를') .값. 대신 ng-model : https://docs.angularjs.org/api/ng/directive/ngModel과 같은 지시문을 사용하십시오. – floor

콘솔에 오류가 있습니까? 해당 콘솔 로그 문에 사용자를 등록 할 때 사용자의 가치는 무엇입니까? 가능하다면 이것을 jsfiddle에 던지십시오. – floor

[ask]를 읽으십시오. 핵심 구절 : "검색 및 연구"및 "당신이 직접 해결하지 못하게하는 어려움을 설명하십시오." –

입니다. 이 같은 그래서, 당신은 html로해야 뭔가 :

<body ng-app='myApp'> 

    <form id='form' ng-controller='logIn'> 
     <h1>Log In</h1> 
     <!-- Using ng-model is how you bind data from the view to the controller in AngularJS --> 
     <input type='text' ng-model='username' placeholder='Enter Username' /> 
     <input type='password' ng-model='password' placeholder='Enter Password' /> 
    <!-- we send the binded data to the function as parameters --> 
     <button id="button" type="button" ng-click='log(username, password)'>Click This</button> 
    </form> 

    <form id='form2' ng-controller='registerUser'> 
    <h1>Register</h1> 
    <!-- Using ng-model is how you bind data from the view to the controller in AngularJS --> 
    <input type='text' ng-model='registerName' placeholder='Enter Username'/> 
    <input type='password' ng-model='registerPass' placeholder='Enter Password'/> 
    <!-- we send the binded data to the function as parameters --> 
    <button id='registerButton' type='button' ng-click='place(registerName, registerPass)'>Register</button> 
    </form> 
</body>

그리고 당신의 컨트롤러 :

var users = [ 
    { 
     username: 'Regie', 
     password: 'Tano' 
    }, 
    { 
     username: 'Jacob', 
     password: 'Minshall' 
    }, 
    { 
     username: 'Greg', 
     password: 'Mayer' 
    } 
    ] 

app.controller("logIn", function($scope){ 
    // This is the username and password in the html 
    $scope.username = ''; // ng-model="username" 
    $scope.password = ''; // ng-model="password" 

    $scope.log = function(username, password){  

    //Loop through users to check if username and password are correct. 
    for(i = 0; i < users.length; i++){ 
     if(username == users[i].username && password == users[i].password){ 
     alert('That Username or Password is already taken') 
     } 
    } 
    } 
}); 

//REGISTER USER********** 
app.controller("registerUser", function($scope){ 
// This is the registerName and registerPass in the html 
$scope.registerName = ''; // ng-model="registerName" 
$scope.registerPass = ''; // ng-model="registerPass" 

// Instead of read the data in the model, we pass them as parameters. Doing this is better for testing. 
$scope.place = function(registerName, registerPass){  

    var newUser = { 
    username: registerName, 
    password: registerPass 
    } 

users.push(newUser) 
console.log(users) 

} 
});

출처

2017-05-01 20:38:36

새 로그인 정보 등록 Angular JS

답변

관련 문제