jQuery 在 angularjs 应用程序中加载初始数据
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/18748115/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Load initial data in an angularjs app
提问by bomortensen
I'm currently trying to develop an AngularJS app. This is my first application using AngularJS and I think I'm pretty aware of how it works since I've been a Silverlight developer for some years :-)
我目前正在尝试开发一个 AngularJS 应用程序。这是我第一个使用 AngularJS 的应用程序,我想我很清楚它是如何工作的,因为我已经做了多年的 Silverlight 开发人员:-)
However, there's one, simple thing I cannot figure out: how to get the initial data for the app when it starts.
但是,有一件简单的事情我无法弄清楚:如何在应用程序启动时获取它的初始数据。
What I need is a simple table of data where a few fields can be edited inline (by dropdowns) My app structure is like this:
我需要的是一个简单的数据表,其中几个字段可以内联编辑(通过下拉菜单)我的应用程序结构是这样的:
app.js
应用程序.js
var app = angular.module('feedbackApp', []);
feedbackService.js
反馈服务.js
app.service('feedbackService', function ($http) {
this.getFeedbackPaged = function (nodeId, pageNumber, take) {
$http.get('myUrl', function (response) {
return response;
});
};
});
feedbackController.js
反馈控制器.js
app.controller('feedbackController', function ($scope, feedbackService, $filter) {
// Constructor for this controller
init();
function init() {
$scope.feedbackItems = feedbackService.getFeedbackPaged(1234, 1, 20);
}
});
Markup
标记
<html ng-app="feedbackApp">
<head>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
</head>
<body>
<table class="table" style="border: 1px solid #000; width:50%;">
<tr ng-repeat="fb in feedbackItems | orderBy: 'Id'" style="width:auto !important;">
<td data-title="Ansvarlig">
{{ fb.Name }}
</td>
<td data-title="Kommentar">
{{ fb.Comment }}
</td>
</tr>
</table>
</body>
But the table is empty when I run the application. I think it's because the app starts before the data from the service is added to the viewmodel ($scope), but I have no idea of how to make it initialise before the app starts, so the first 20 table rows are displayed.
但是当我运行应用程序时表是空的。我认为这是因为应用程序在将来自服务的数据添加到视图模型 ($scope) 之前启动,但我不知道如何在应用程序启动之前对其进行初始化,因此显示了前 20 个表行。
Does anyone know how to do this?
有谁知道如何做到这一点?
Thanks in advance!
提前致谢!
回答by Ajay Beniwal
You should modify your code a bit to make it working since you are working with promise here you should use .then
您应该稍微修改您的代码以使其工作,因为您在这里使用 promise,您应该使用 .then
app.service('feedbackService', function ($http) {
this.getFeedbackPaged = function (nodeId, pageNumber, take) {
return $http.get('myUrl');
};
});
app.controller('feedbackController', function ($scope, feedbackService, $filter) {
// Constructor for this controller
init();
function init() {
feedbackService.getFeedbackPaged(1234, 1, 20).then(function(data){$scope.feedbackItems=data;});
}
});