AngularJS控制器不能用簡單的初始化代碼

新的工作，以AngularJS和不知道WATS發生在這裏並沒有什麼時，我跑這得到填充....AngularJS控制器不能用簡單的初始化代碼

使用的版本 - 1.6 請過目一下，可能是很無聊的問題，但沒有得到通過;）

<!DOCTYPE html> 
 
<html data-ng-app=""> 
 
<head> 
 
<meta charset="ISO-8859-1"> 
 
<title>Insert title here</title> 
 
</head> 
 
<body> 
 
\t <div data-ng-controller="simpleController"> 
 
\t \t Name: 
 
\t \t <br/> 
 
\t \t <input type="text" data-ng-model="fname" /> 
 
\t \t <br/> 
 
\t \t <ul> 
 
\t \t \t <li data-ng-repeat="cust in customers | filter:name | orderBy:'city'">{{ cust.name | uppercase }} - {{ cust.city | lowercase}}</li> 
 
\t \t </ul> 
 
\t </div> 
 
<script src="js/angular.min.js"></script> 
 
<script> 
 
    \t function simpleController($scope){ 
 
\t \t 
 
\t \t $scope.customers = [ 
 
\t \t      {name:'anil', city:'bengaluru'}, 
 
\t \t      {name:'rahul', city:'pune'}, 
 
\t \t      {name:'abc', city:'hyd'}, 
 
\t \t      {name:'xyz', city:'mysore'} 
 
\t \t      ]; 
 
\t }

來源

2017-03-13 Anil B

可以請你對創造的角度應用模塊和控制器進行更多的研究。 [角JS]（https://angularjs.org/） –

創建一個從angular控制器然後使用它

代碼是：

<!DOCTYPE html> 
<html data-ng-app="app"> 

<head> 
    <meta charset="ISO-8859-1"> 
    <title>Insert title here</title> 
</head> 

<body> 
    <div data-ng-controller="simpleController"> 
     Name: 
     <br/> 
     <input type="text" data-ng-model="fname" /> 
     <br/> 
     <ul> 
      <li data-ng-repeat="cust in customers | filter:name | orderBy:'city'">{{ cust.name | uppercase }} - {{ cust.city | lowercase}}</li> 
     </ul> 
    </div> 
    <script src="js/angular.min.js"></script> 
    <script> 
    angular.module("app").controller('simpleController', simpleController); 

    function simpleController($scope) { 

     $scope.customers = [{ 
      name: 'anil', 
      city: 'bengaluru' 
     }, { 
      name: 'rahul', 
      city: 'pune' 
     }, { 
      name: 'abc', 
      city: 'hyd' 
     }, { 
      name: 'xyz', 
      city: 'mysore' 
     }]; 
    } 
    </script> 
</body> 
</html>

來源

2017-03-13 05:08:28 Gaurav

需要定義的角模塊和控制器。

angular.module("app",[]) 
 
.controller("ctrl",simpleController); 
 

 
    
 
    \t function simpleController($scope){ 
 
\t \t 
 
\t \t $scope.customers = [ 
 
\t \t      {name:'anil', city:'bengaluru'}, 
 
\t \t      {name:'rahul', city:'pune'}, 
 
\t \t      {name:'abc', city:'hyd'}, 
 
\t \t      {name:'xyz', city:'mysore'} 
 
\t \t      ]; 
 
\t }

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div data-ng-app="app" data-ng-controller="simpleController"> 
 
\t \t Name: 
 
\t \t <br/> 
 
\t \t <input type="text" data-ng-model="fname" /> 
 
\t \t <br/> 
 
\t \t <ul> 
 
\t \t \t <li data-ng-repeat="cust in customers | filter:name | orderBy:'city'">{{ cust.name | uppercase }} - {{ cust.city | lowercase}}</li> 
 
\t \t </ul> 
 
\t </div>

來源

2017-03-13 05:25:22

你必須在使用之前創建的控制器。創建通過控制器：

angular.Module("ModuleName",[]).Controller("ControllerName",function($scope){ 
});

根據您的代碼：

<!DOCTYPE html> 
 
<html data-ng-app="app"> 
 

 
<head> 
 
    <meta charset="ISO-8859-1"> 
 
    <title>Insert title here</title> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.1/angular.min.js"></script> 
 
    <script> 
 
    angular.module("app",[]).controller('simpleController', 
 

 
    function simpleController($scope) { 
 

 
     $scope.customers = [{ 
 
      name: 'anil', 
 
      city: 'bengaluru' 
 
     }, { 
 
      name: 'rahul', 
 
      city: 'pune' 
 
     }, { 
 
      name: 'abc', 
 
      city: 'hyd' 
 
     }, { 
 
      name: 'xyz', 
 
      city: 'mysore' 
 
     }]; 
 
    }); 
 
    </script> 
 
</head> 
 

 
<body> 
 
    <div data-ng-controller="simpleController"> 
 
     Name: 
 
     <br/> 
 
     <input type="text" data-ng-model="fname" /> 
 
     <br/> 
 
     <ul> 
 
      <li data-ng-repeat="cust in customers | filter:name | orderBy:'city'">{{ cust.name | uppercase }} - {{ cust.city | lowercase}}</li> 
 
     </ul> 
 
    </div> 
 
    
 
    
 
</body>

來源

2017-03-13 05:40:44

首先你需要有定義的，開始你的項目的模塊。 Try this blog to learn more。更簡單的例子請嘗試this。

爲了讓你需要爲封裝與ng-app你的觀點，你的情況，你有你的應用程序的工作。那麼你需要創建一個module在你的情況下它的失蹤。然後根據你的需要添加services和controller。

angular.module("app",[]) 
 
    .controller("ctrl",simpleController); 
 
    
 
    \t function simpleController($scope){ 
 
\t \t 
 
\t \t $scope.customers = [ 
 
\t      {name:'anil', city:'bengaluru'}, 
 
\t      {name:'rahul', city:'pune'}, 
 
\t      {name:'abc', city:'hyd'}, 
 
\t      {name:'xyz', city:'mysore'} 
 
\t      ]; 
 
\t }

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div data-ng-app="app" data-ng-controller="simpleController"> 
 
\t \t Name: 
 
\t \t <br/> 
 
\t \t <input type="text" data-ng-model="fname" /> 
 
\t \t <br/> 
 
\t \t <ul> 
 
\t \t \t <li data-ng-repeat="cust in customers | filter:name | orderBy:'city'">{{ cust.name | uppercase }} - {{ cust.city | lowercase}}</li> 
 
\t \t </ul> 
 
\t </div>

來源

2017-03-13 05:59:20

AngularJS控制器不能用簡單的初始化代碼

回答

相關問題