无法从Angular.js中的控制器获取数据
Unable to fetch data from controller in Angular.js
我是AngularJS的新手。事实上,这是我的第一天。我在这里要做的是从我制作的控制器中获取数据,并将其显示在视图中。但我不知道为什么,这不是简单的工作。
我的数据是学生名单。我所要做的就是按列表顺序显示学生列表,并根据文本框中输入的姓名过滤列表。
我的代码很简单:
<!DOCTYPE html>
<html ng-app>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.js"></script>
</head>
<body>
<h1>Hello!</h1>
Student Name:
<br />
<input type="text" ng-model="sname" /> {{ sname }}
<div id="mvvm_communication" class="container" data-ng-controller="simpleController">
<ul>
<li ng-repeat="stud in students | filter:sname | orderBy:'firstname'" >{{stud.firstname | lowercase }}, {{stud.lastname| uppercase }}</li>
</ul>
</div>
<script>
function simpleController($scope)
{
$scope.students=[
{firstname:'Jordan',lastname:'Rains'},
{firstname:'Michael',lastname:'Jordan'},
{firstname:'John',lastname:'Doe'},
{firstname:'John',lastname:'Smith'},
{firstname:'Simcha',lastname:'Michelle'},
{firstname:'Sydney',lastname:'Rivers'},
{firstname:'Summer',lastname:'Rose'},
{firstname:'Georgia',lastname:'Schubert'},
{firstname:'Rosalie',lastname:'Fayadh'}
];
}
</script>
</body>
</html>
这是一把小提琴。
您需要注册您的控制器!
var myApp = angular.module('myApp',[]);
myApp.controller('simpleController', ['$scope', simpleController]);
然后您还需要在ng-app
中输入一个名称。
<html ng-app="myApp">
我已经更新了您的JSFiddle:
HTML:
<div ng-app="app">
<div ng-controller="simpleController">
<h1>Hello Student!</h1> Student Name:<br/>
<input type="text" ng-model="sname" /> {{ sname }}
<div id="mvvm_communication" class="container">
<ul>
<li ng-repeat="stud in students | filter:sname | orderBy:'firstname'" >{{stud.firstname | lowercase }}, {{stud.lastname| uppercase }}</li>
</ul>
</div>
</div>
</div>
角度:
var app = angular.module('app', []);
app.controller('simpleController', function($scope) {
$scope.students=[
{firstname:'Jordan',lastname:'Rains'},
{firstname:'Michael',lastname:'Jordan'},
{firstname:'John',lastname:'Doe'},
{firstname:'John',lastname:'Smith'},
{firstname:'Simcha',lastname:'Michelle'},
{firstname:'Sydney',lastname:'Rivers'},
{firstname:'Summer',lastname:'Rose'},
{firstname:'Georgia',lastname:'Schubert'},
{firstname:'Rosalie',lastname:'Fayadh'}
];
});
您需要定义一个角度模块:
angular.module('app', []).controller('simpleController', simpleController);
请参阅jsFiddle
相关文章:
- ROR:如何在不重新加载浏览器的情况下从控制器获取参数
- MVC Razor 从 javascript 视图中的控制器获取值
- 从圣杯控制器获取复选框值
- 尝试使用Backbone.sync从Rails中的动作控制器获取数据-非restful
- 如何在laravel4中从控制器获取数组到ajax函数
- 无法从Angular.js中的控制器获取数据
- Symfony2-从路由到控制器获取ID
- 如何在使用映射时从控制器获取数据
- 指令应从模板或控制器获取数据
- 在 angularjs 中从视图到控制器获取值
- Magento通过控制器获取整个页面,而不仅仅是变量值
- 如何从控制器获取表示 ngRepeat 中元素的 HTML 节点的参数
- 我的 Angular 指令没有从控制器获取数据
- 将返回的对象从控制器获取到 javascript 中
- 如何从控制器获取夹具中的记录总数
- 如何从指令中的控制器获取值
- 使用 Angular 的$http时无法从控制器获取 json 信息
- 无法将对象从控制器获取到 JSP
- 从控制器获取结果,使用t4模板生成js intellisense
- 从Typeaahead.js中的symfony控制器获取数据