admin管理员组文章数量:1025218
What am i doing wrong here, I am new to angular, its showing the error above, here is my code
<script type="text/javascript" src=".3.9/angular.js"></script>
<script>
function simpleController($scope){
$scope.customers=[
{name:'Alphy Poxy',city:'Mbita'},
{name:'Kibaki Watson',city:'Kikuyu'},
{name:'John Legend',city:'Lake'},
{name:'Sony',city:'HB'}
];
}
</script>
</head>
<body>
<div class="container-fluid" ng-controller="simpleController">
Name: <input type="text" ng-model="name"/>
<ul>
<li ng-repeat="coders in customers | filter:name | orderBy:'name'">{{coders.name}}-{{coders.city}}</li>
</ul>
</div>
</body>
What am i doing wrong here, I am new to angular, its showing the error above, here is my code
<script type="text/javascript" src="https://ajax.googleapis./ajax/libs/angularjs/1.3.9/angular.js"></script>
<script>
function simpleController($scope){
$scope.customers=[
{name:'Alphy Poxy',city:'Mbita'},
{name:'Kibaki Watson',city:'Kikuyu'},
{name:'John Legend',city:'Lake'},
{name:'Sony',city:'HB'}
];
}
</script>
</head>
<body>
<div class="container-fluid" ng-controller="simpleController">
Name: <input type="text" ng-model="name"/>
<ul>
<li ng-repeat="coders in customers | filter:name | orderBy:'name'">{{coders.name}}-{{coders.city}}</li>
</ul>
</div>
</body>
Share
Improve this question
asked Jan 15, 2015 at 9:30
alphyalphy
2913 silver badges19 bronze badges
1
- 1 If you're using the Angular JS in 60 Minutes tutorial, the instructions will stop working with newer version of Angular because it will not allow you to use a controller in the global scope - see this post: stackoverflow./questions/24894870/… – TriumphST Commented May 21, 2016 at 21:59
3 Answers
Reset to default 7You haven't created properly your controller. Please see the following snippet.
var myApp = angular.module('myApp',[]);
myApp.controller('simpleController', ['$scope', function($scope) {
$scope.customers=[
{name:'Alphy Poxy',city:'Mbita'},
{name:'Kibaki Watson',city:'Kikuyu'},
{name:'John Legend',city:'Lake'},
{name:'Sony',city:'HB'}
];
}]);
<script src="https://ajax.googleapis./ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div class="container-fluid" ng-app="myApp" ng-controller="simpleController">
Name: <input type="text" ng-model="name"/>
<ul>
<li ng-repeat="coders in customers | filter:name | orderBy:'name'">{{coders.name}}-{{coders.city}}</li>
</ul>
</div>
Or at least you need to pub ng-app directive in parent html tag please see demo below
function simpleController($scope) {
$scope.customers = [{
name: 'Alphy Poxy',
city: 'Mbita'
}, {
name: 'Kibaki Watson',
city: 'Kikuyu'
}, {
name: 'John Legend',
city: 'Lake'
}, {
name: 'Sony',
city: 'HB'
}];
}
<script src="https://ajax.googleapis./ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app>
<div class="container-fluid" ng-controller="simpleController">
Name:
<input type="text" ng-model="name" />
<ul>
<li ng-repeat="coders in customers | filter:name | orderBy:'name'">{{coders.name}}-{{coders.city}}</li>
</ul>
</div>
</div>
Best way is to really to do as @Christos is saying.
Or you could add:
1. add np-app along with a module name ( ng-app="app" )
2. add controller assigning it in. ( app.controller('SimpleController', SimpleController);
<script>
function simpleController($scope){
$scope.customers=[
{name:'Alphy Poxy',city:'Mbita'},
{name:'Kibaki Watson',city:'Kikuyu'},
{name:'John Legend',city:'Lake'},
{name:'Sony',city:'HB'}
];
}
app.controller('SimpleController', SimpleController);
</script>
</head>
<body>
<div class="container-fluid" ng-controller="simpleController" ng-app="app">
Name: <input type="text" ng-model="name"/>
<ul>
<li ng-repeat="coders in customers | filter:name | orderBy:'name'">{{coders.name}}-{{coders.city}}</li>
</ul>
</div>
</body>
What am i doing wrong here, I am new to angular, its showing the error above, here is my code
<script type="text/javascript" src=".3.9/angular.js"></script>
<script>
function simpleController($scope){
$scope.customers=[
{name:'Alphy Poxy',city:'Mbita'},
{name:'Kibaki Watson',city:'Kikuyu'},
{name:'John Legend',city:'Lake'},
{name:'Sony',city:'HB'}
];
}
</script>
</head>
<body>
<div class="container-fluid" ng-controller="simpleController">
Name: <input type="text" ng-model="name"/>
<ul>
<li ng-repeat="coders in customers | filter:name | orderBy:'name'">{{coders.name}}-{{coders.city}}</li>
</ul>
</div>
</body>
What am i doing wrong here, I am new to angular, its showing the error above, here is my code
<script type="text/javascript" src="https://ajax.googleapis./ajax/libs/angularjs/1.3.9/angular.js"></script>
<script>
function simpleController($scope){
$scope.customers=[
{name:'Alphy Poxy',city:'Mbita'},
{name:'Kibaki Watson',city:'Kikuyu'},
{name:'John Legend',city:'Lake'},
{name:'Sony',city:'HB'}
];
}
</script>
</head>
<body>
<div class="container-fluid" ng-controller="simpleController">
Name: <input type="text" ng-model="name"/>
<ul>
<li ng-repeat="coders in customers | filter:name | orderBy:'name'">{{coders.name}}-{{coders.city}}</li>
</ul>
</div>
</body>
Share
Improve this question
asked Jan 15, 2015 at 9:30
alphyalphy
2913 silver badges19 bronze badges
1
- 1 If you're using the Angular JS in 60 Minutes tutorial, the instructions will stop working with newer version of Angular because it will not allow you to use a controller in the global scope - see this post: stackoverflow./questions/24894870/… – TriumphST Commented May 21, 2016 at 21:59
3 Answers
Reset to default 7You haven't created properly your controller. Please see the following snippet.
var myApp = angular.module('myApp',[]);
myApp.controller('simpleController', ['$scope', function($scope) {
$scope.customers=[
{name:'Alphy Poxy',city:'Mbita'},
{name:'Kibaki Watson',city:'Kikuyu'},
{name:'John Legend',city:'Lake'},
{name:'Sony',city:'HB'}
];
}]);
<script src="https://ajax.googleapis./ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div class="container-fluid" ng-app="myApp" ng-controller="simpleController">
Name: <input type="text" ng-model="name"/>
<ul>
<li ng-repeat="coders in customers | filter:name | orderBy:'name'">{{coders.name}}-{{coders.city}}</li>
</ul>
</div>
Or at least you need to pub ng-app directive in parent html tag please see demo below
function simpleController($scope) {
$scope.customers = [{
name: 'Alphy Poxy',
city: 'Mbita'
}, {
name: 'Kibaki Watson',
city: 'Kikuyu'
}, {
name: 'John Legend',
city: 'Lake'
}, {
name: 'Sony',
city: 'HB'
}];
}
<script src="https://ajax.googleapis./ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app>
<div class="container-fluid" ng-controller="simpleController">
Name:
<input type="text" ng-model="name" />
<ul>
<li ng-repeat="coders in customers | filter:name | orderBy:'name'">{{coders.name}}-{{coders.city}}</li>
</ul>
</div>
</div>
Best way is to really to do as @Christos is saying.
Or you could add:
1. add np-app along with a module name ( ng-app="app" )
2. add controller assigning it in. ( app.controller('SimpleController', SimpleController);
<script>
function simpleController($scope){
$scope.customers=[
{name:'Alphy Poxy',city:'Mbita'},
{name:'Kibaki Watson',city:'Kikuyu'},
{name:'John Legend',city:'Lake'},
{name:'Sony',city:'HB'}
];
}
app.controller('SimpleController', SimpleController);
</script>
</head>
<body>
<div class="container-fluid" ng-controller="simpleController" ng-app="app">
Name: <input type="text" ng-model="name"/>
<ul>
<li ng-repeat="coders in customers | filter:name | orderBy:'name'">{{coders.name}}-{{coders.city}}</li>
</ul>
</div>
</body>
本文标签:
版权声明:本文标题:javascript - Error: [ng:areq] Argument 'simpleController' is not a function, got undefined - Stack Overflow 内容由热心网友自发贡献,该文观点仅代表作者本人, 转载请联系作者并注明出处:http://it.en369.cn/questions/1744400131a2095158.html, 本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容,一经查实,本站将立刻删除。
发表评论