ng-app 값이 빈 문자열이 아닌 경우 각도 지시문이 작동하지 않습니다.

AngularJs를 처음 사용했습니다. 나는 왜 혼란 스러울 뿐인가? ng-app의 값이 빈 문자열 일 때 Angular 지시문이 작동하고 있지만 다른 한편으로 지시문이 작동하지 않는 경우에는 값이 빈 문자열이 아닙니다.ng-app 값이 빈 문자열이 아닌 경우 각도 지시문이 작동하지 않습니다.

여기 무슨 일입니까? 내 코드는 다음과 같습니다 :

<%@ page language="java" contentType="text/html; charset=ISO-8859-1" 
    pageEncoding="ISO-8859-1"%> 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 

<meta http-equiv="Content-Type" name="viewport" content="width=device-width, initial-scale=1"; charset=ISO-8859-1"> 

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous"> 
<link rel="stylesheet" type="text/css" href="css/loginPage.css"> 

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script> 
<title>Login</title> 
</head> 
<body **ng-app="loginApp"** class="body-bg-blue"> 
    <div class="container"> 
     <div class="row"></div> 
     <div class="row"> 
      <div class="col-sm-2"></div> 
      <div class="col-sm-8"> 
       <div class="jumbotron vertical-center"> 
        <div class="login-form"> 

         <div class="page-header"> 
          <h1>STWEBAPP</h1> 
         </div> 

         <div **ng-controller="loginController"**> 

          <form name="loginForm" ng-submit="login()" role="form"> 
           <div class="form-group"> 
            <input type="text" name="username" id="username" ng-model="username" class="form-control" placeholder="User Name" required /> 
            <span ng-show="loginForm.username.$dirty && loginForm.username.$error.required" class="help-block">Username is required</span> 
           </div> 
           <div class="form-group"> 
            <input type="password" name="password" id="password" ng-model="password" class="form-control" placeholder="Password" required /> 
            <span ng-show="loginForm.password.$dirty && loginForm.password.$error.required" class="help-block">Password is required</span> 
           </div> 
           <div class="checkbox"> 
            <label><input type="checkbox"> Remember me</label> 
           </div> 
           <div class="form-group"> 
            <button type="submit" ng-disabled="form.$invalid || dataLoading" class="btn-danger">Login</button> 
            <img ng-if="dataLoading" src="data:image/gif;base64,R0lGODlhEAAQAPIAAP///wAAAMLCwkJCQgAAAGJiYoKCgpKSkiH/C05FVFNDQVBFMi4wAwEAAAAh/hpDcmVhdGVkIHdpdGggYWpheGxvYWQuaW5mbwAh+QQJCgAAACwAAAAAEAAQAAADMwi63P4wyklrE2MIOggZnAdOmGYJRbExwroUmcG2LmDEwnHQLVsYOd2mBzkYDAdKa+dIAAAh+QQJCgAAACwAAAAAEAAQAAADNAi63P5OjCEgG4QMu7DmikRxQlFUYDEZIGBMRVsaqHwctXXf7WEYB4Ag1xjihkMZsiUkKhIAIfkECQoAAAAsAAAAABAAEAAAAzYIujIjK8pByJDMlFYvBoVjHA70GU7xSUJhmKtwHPAKzLO9HMaoKwJZ7Rf8AYPDDzKpZBqfvwQAIfkECQoAAAAsAAAAABAAEAAAAzMIumIlK8oyhpHsnFZfhYumCYUhDAQxRIdhHBGqRoKw0R8DYlJd8z0fMDgsGo/IpHI5TAAAIfkECQoAAAAsAAAAABAAEAAAAzIIunInK0rnZBTwGPNMgQwmdsNgXGJUlIWEuR5oWUIpz8pAEAMe6TwfwyYsGo/IpFKSAAAh+QQJCgAAACwAAAAAEAAQAAADMwi6IMKQORfjdOe82p4wGccc4CEuQradylesojEMBgsUc2G7sDX3lQGBMLAJibufbSlKAAAh+QQJCgAAACwAAAAAEAAQAAADMgi63P7wCRHZnFVdmgHu2nFwlWCI3WGc3TSWhUFGxTAUkGCbtgENBMJAEJsxgMLWzpEAACH5BAkKAAAALAAAAAAQABAAAAMyCLrc/jDKSatlQtScKdceCAjDII7HcQ4EMTCpyrCuUBjCYRgHVtqlAiB1YhiCnlsRkAAAOwAAAAAAAAAAAA=="/> 
           </div> 
          </form> 

         </div> 
        </div> 
       </div> 
      </div> 
      <div class="col-sm-2"></div> 
     </div> 
     <div class="row"></div> 
    </div> 
</body> 
</html>

출처

2017-01-04 Kevin Macaraeg

은뿐만 아니라 당신의 지시 코드를 게시 – Sajeetharan

업데이트 완료! :) –

여전히 코드에서 어떤 지시어도 보이지 않습니다. – Sajeetharan

난 당신이 ng-app INT의 이름과 그 응용 프로그램을 선언하는 경우, 당신은 선언 할 모듈이 필요합니다, 당신은 NG-응용 프로그램 지침에 대해 이야기하고 있다고 가정합니다.

var app = angular.module("loginApp", []); 
app.controller("loginController", ["$scope", 
function($scope) { 


} 
]);

DEMO

var app = angular.module("loginApp", []); 
 

 
app.controller("loginController", ["$scope", 
 
    function($scope) { 
 
    
 
     
 
    } 
 
]);

<html> 
 
<head> 
 

 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous"> 
 
<link rel="stylesheet" type="text/css" href="css/loginPage.css"> 
 

 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script> 
 
<title>Login</title> 
 
</head> 
 
<body ng-app="loginApp" class="body-bg-blue"> 
 
    <div class="container"> 
 
     <div class="row"></div> 
 
     <div class="row"> 
 
      <div class="col-sm-2"></div> 
 
      <div class="col-sm-8"> 
 
       <div class="jumbotron vertical-center"> 
 
        <div class="login-form"> 
 

 
         <div class="page-header"> 
 
          <h1>STWEBAPP</h1> 
 
         </div> 
 

 
         <div ng-controller="loginController"> 
 

 
          <form name="loginForm" ng-submit="login()" role="form"> 
 
           <div class="form-group"> 
 
            <input type="text" name="username" id="username" ng-model="username" class="form-control" placeholder="User Name" required /> 
 
            <span ng-show="loginForm.username.$dirty && loginForm.username.$error.required" class="help-block">Username is required</span> 
 
           </div> 
 
           <div class="form-group"> 
 
            <input type="password" name="password" id="password" ng-model="password" class="form-control" placeholder="Password" required /> 
 
            <span ng-show="loginForm.password.$dirty && loginForm.password.$error.required" class="help-block">Password is required</span> 
 
           </div> 
 
           <div class="checkbox"> 
 
            <label><input type="checkbox"> Remember me</label> 
 
           </div> 
 
           <div class="form-group"> 
 
            <button type="submit" ng-disabled="form.$invalid || dataLoading" class="btn-danger">Login</button> 
 
            <img ng-if="dataLoading" src="data:image/gif;base64,R0lGODlhEAAQAPIAAP///wAAAMLCwkJCQgAAAGJiYoKCgpKSkiH/C05FVFNDQVBFMi4wAwEAAAAh/hpDcmVhdGVkIHdpdGggYWpheGxvYWQuaW5mbwAh+QQJCgAAACwAAAAAEAAQAAADMwi63P4wyklrE2MIOggZnAdOmGYJRbExwroUmcG2LmDEwnHQLVsYOd2mBzkYDAdKa+dIAAAh+QQJCgAAACwAAAAAEAAQAAADNAi63P5OjCEgG4QMu7DmikRxQlFUYDEZIGBMRVsaqHwctXXf7WEYB4Ag1xjihkMZsiUkKhIAIfkECQoAAAAsAAAAABAAEAAAAzYIujIjK8pByJDMlFYvBoVjHA70GU7xSUJhmKtwHPAKzLO9HMaoKwJZ7Rf8AYPDDzKpZBqfvwQAIfkECQoAAAAsAAAAABAAEAAAAzMIumIlK8oyhpHsnFZfhYumCYUhDAQxRIdhHBGqRoKw0R8DYlJd8z0fMDgsGo/IpHI5TAAAIfkECQoAAAAsAAAAABAAEAAAAzIIunInK0rnZBTwGPNMgQwmdsNgXGJUlIWEuR5oWUIpz8pAEAMe6TwfwyYsGo/IpFKSAAAh+QQJCgAAACwAAAAAEAAQAAADMwi6IMKQORfjdOe82p4wGccc4CEuQradylesojEMBgsUc2G7sDX3lQGBMLAJibufbSlKAAAh+QQJCgAAACwAAAAAEAAQAAADMgi63P7wCRHZnFVdmgHu2nFwlWCI3WGc3TSWhUFGxTAUkGCbtgENBMJAEJsxgMLWzpEAACH5BAkKAAAALAAAAAAQABAAAAMyCLrc/jDKSatlQtScKdceCAjDII7HcQ4EMTCpyrCuUBjCYRgHVtqlAiB1YhiCnlsRkAAAOwAAAAAAAAAAAA=="/> 
 
           </div> 
 
          </form> 
 

 
         </div> 
 
        </div> 
 
       </div> 
 
      </div> 
 
      <div class="col-sm-2"></div> 
 
     </div> 
 
     <div class="row"></div> 
 
    </div> 
 
</body> 
 
</html>

출처

2017-01-04 02:34:22 Sajeetharan

인 경우 ng-show가 작동하지 않습니다! 고마워요! –

ng-app 값이 빈 문자열이 아닌 경우 각도 지시문이 작동하지 않습니다.

답변

관련 문제