2014-09-18 2 views
0

모바일 응용 프로그램을 만들기 위해 Angular.js를 onsenui와 함께 사용하고 있습니다. 이 제외Angular.JS onsenui를 사용하는 동안 컨트롤이 표시되지 않습니다.

<!DOCTYPE html> 
<html> 
<meta charset="utf-8"> 
<link rel="stylesheet" href="lib/onsen/css/onsenui.css"> 
<link rel="stylesheet" href="lib/onsen/css/onsen-css-components.css"> 

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.12/angular.min.js"></script> 
<script src="lib/onsen/js/onsenui.js"></script> 
<script src="js/app.js"></script> 
<script> 
    ons.bootstrap(); 
</script> 

<body ng-app="myApp"> 

<ons-page> 
     <ons-toolbar> 
     <div class="center">Login</div> 
     </ons-toolbar> 

     <ons-list> 
     <ons-list-item> 
      <input type="text" placeholder="Email Address" class="text-input text-input--transparent" style="margin-top:8px; width: 100%;"> 
     </ons-list-item> 

     <ons-list-item> 
      <input type="password" placeholder="Password" class="text-input text-input--transparent" style="margin-top:8px; width: 100%;"> 
     </ons-list-item> 
     </ons-list> 


     <div class="content-padded"> 
     <ons-button modifier="large" onclick="">Save</ons-button> 
     </div> 

     <div class="content-padded"> 
     <ons-button modifier="large" onclick="">Dont have an account?</ons-button> 
     </div> 
</ons-page> 



<div> 
<input type="text" ng-model="name"> 
<p>Hello {{name}}</p> 
</div> 
</body> 
</html> 

<script> 

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

myApp.controller('HelloCtrl', function($scope){ 
    $scope.name = "Onsen UI!"; 
}); 

</script> 

모든 작업을 잘 : 여기 내 코드입니다

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

    myApp.controller('HelloCtrl', function($scope){ 
     $scope.name = "Onsen UI!"; 

제어가 페이지에 표시되지 않습니다. Google에서도 확인했습니다.하지만 아무런 도움이되지 않습니다. 미리 감사드립니다.

답변

1

HTML에서 어떤 컨트롤러를 사용하고 싶습니까? 사용하려는 "최상위"레벨 요소에 ng-controller를 추가하십시오. 귀하의 경우 입력 요소 바로 위의 DIV 요소 일 수 있습니다.

<div ng-controller="HelloCtrl"> 
<input type="text" ng-model="name"> 
<p>Hello {{name}}</p> 
</div> 

내 앱에는 컨트롤러가 있기 때문에 본체에 넣어서 작동합니다.

<body ng-app ng-controller="HelloCtrl"> 

</body> 
+0

문제에 대한 간략한 설명을 추가하고 코드에서 문제를 해결하면 코드가 작동 할 수도 있지만 작동하지 않을 수도 있습니다. 마찬가지로 그것은 [도움말 센터] (http://stackoverflow.com/help/how-to-answer) – dic19

+0

아, 덕분에 전체 답변을 제공하지 않습니다 ... 나는 방금 답변을 편집, 잘하면 도움이됩니다. –

+0

당신은 당신의 편집에 대해 환영 받고 +1합니다. – dic19

관련 문제