我怎么能在IONIC应用程序中使用Json对象而不是硬编码对象呢
How could I use my Json object instead a hardcoded object in my IONIC app?
这是我找到的IONIC应用程序的services.js文件示例。我想使用json文件而不是硬编码对象（varemployees）。我是怎么做到的。我对下面的代码有一个想法，但它不起作用。我认为这可以帮助很多从爱奥尼亚开始的人。
这是第一个services.js代码：
angular.module('directory.services', [])
.factory('EmployeeService', function($q) {
var employees = [
{"id": 1, "firstName": "James", "lastName": "King", "managerId": 0, "managerName": "", "reports": 4, "title": "President and CEO", "department": "Corporate", "cellPhone": "617-000-0001", "officePhone": "781-000-0001", "email": "jking@fakemail.com", "city": "Boston, MA", "pic": "James_King.jpg", "twitterId": "@fakejking", "blog": "http://coenraets.org"},
{"id": 2, "firstName": "Julie", "lastName": "Taylor", "managerId": 1, "managerName": "James King", "reports": 2, "title": "VP of Marketing", "department": "Marketing", "cellPhone": "617-000-0002", "officePhone": "781-000-0002", "email": "jtaylor@fakemail.com", "city": "Boston, MA", "pic": "Julie_Taylor.jpg", "twitterId": "@fakejtaylor", "blog": "http://coenraets.org"},
{"id": 3, "firstName": "Eugene", "lastName": "Lee", "managerId": 1, "managerName": "James King", "reports": 0, "title": "CFO", "department": "Accounting", "cellPhone": "617-000-0003", "officePhone": "781-000-0003", "email": "elee@fakemail.com", "city": "Boston, MA", "pic": "Eugene_Lee.jpg", "twitterId": "@fakeelee", "blog": "http://coenraets.org"},
{"id": 4, "firstName": "John", "lastName": "Williams", "managerId": 1, "managerName": "James King", "reports": 3, "title": "VP of Engineering", "department": "Engineering", "cellPhone": "617-000-0004", "officePhone": "781-000-0004", "email": "jwilliams@fakemail.com", "city": "Boston, MA", "pic": "John_Williams.jpg", "twitterId": "@fakejwilliams", "blog": "http://coenraets.org"},
{"id": 5, "firstName": "Ray", "lastName": "Moore", "managerId": 1, "managerName": "James King", "reports": 2, "title": "VP of Sales", "department": "Sales", "cellPhone": "617-000-0005", "officePhone": "781-000-0005", "email": "rmoore@fakemail.com", "city": "Boston, MA", "pic": "Ray_Moore.jpg", "twitterId": "@fakermoore", "blog": "http://coenraets.org"},
{"id": 6, "firstName": "Paul", "lastName": "Jones", "managerId": 4, "managerName": "John Williams", "reports": 0, "title": "QA Manager", "department": "Engineering", "cellPhone": "617-000-0006", "officePhone": "781-000-0006", "email": "pjones@fakemail.com", "city": "Boston, MA", "pic": "Paul_Jones.jpg", "twitterId": "@fakepjones", "blog": "http://coenraets.org"},
{"id": 7, "firstName": "Paula", "lastName": "Gates", "managerId": 4, "managerName": "John Williams", "reports": 0, "title": "Software Architect", "department": "Engineering", "cellPhone": "617-000-0007", "officePhone": "781-000-0007", "email": "pgates@fakemail.com", "city": "Boston, MA", "pic": "Paula_Gates.jpg", "twitterId": "@fakepgates", "blog": "http://coenraets.org"},
{"id": 8, "firstName": "Lisa", "lastName": "Wong", "managerId": 2, "managerName": "Julie Taylor", "reports": 0, "title": "Marketing Manager", "department": "Marketing", "cellPhone": "617-000-0008", "officePhone": "781-000-0008", "email": "lwong@fakemail.com", "city": "Boston, MA", "pic": "Lisa_Wong.jpg", "twitterId": "@fakelwong", "blog": "http://coenraets.org"},
{"id": 9, "firstName": "Gary", "lastName": "Donovan", "managerId": 2, "managerName": "Julie Taylor", "reports": 0, "title": "Marketing Manager", "department": "Marketing", "cellPhone": "617-000-0009", "officePhone": "781-000-0009", "email": "gdonovan@fakemail.com", "city": "Boston, MA", "pic": "Gary_Donovan.jpg", "twitterId": "@fakegdonovan", "blog": "http://coenraets.org"},
{"id": 10, "firstName": "Kathleen", "lastName": "Byrne", "managerId": 5, "managerName": "Ray Moore", "reports": 0, "title": "Sales Representative", "department": "Sales", "cellPhone": "617-000-0010", "officePhone": "781-000-0010", "email": "kbyrne@fakemail.com", "city": "Boston, MA", "pic": "Kathleen_Byrne.jpg", "twitterId": "@fakekbyrne", "blog": "http://coenraets.org"},
{"id": 11, "firstName": "Amy", "lastName": "Jones", "managerId": 5, "managerName": "Ray Moore", "reports": 0, "title": "Sales Representative", "department": "Sales", "cellPhone": "617-000-0011", "officePhone": "781-000-0011", "email": "ajones@fakemail.com", "city": "Boston, MA", "pic": "Amy_Jones.jpg", "twitterId": "@fakeajones", "blog": "http://coenraets.org"},
{"id": 12, "firstName": "Steven", "lastName": "Wells", "managerId": 4, "managerName": "John Williams", "reports": 0, "title": "Software Architect", "department": "Engineering", "cellPhone": "617-000-0012", "officePhone": "781-000-0012", "email": "swells@fakemail.com", "city": "Boston, MA", "pic": "Steven_Wells.jpg", "twitterId": "@fakeswells", "blog": "http://coenraets.org"}
];
// We use promises to make this api asynchronous. This is clearly not necessary when using in-memory data
// but it makes this service more flexible and plug-and-play. For example, you can now easily replace this
// service with a JSON service that gets its data from a remote server without having to changes anything
// in the modules invoking the data service since the api is already async.
return {
findAll: function() {
var deferred = $q.defer();
deferred.resolve(employees);
return deferred.promise;
},
findById: function(employeeId) {
var deferred = $q.defer();
var employee = employees[employeeId - 1];
deferred.resolve(employee);
return deferred.promise;
},
findByName: function(searchKey) {
var deferred = $q.defer();
var results = employees.filter(function(element) {
var fullName = element.firstName + " " + element.lastName;
return fullName.toLowerCase().indexOf(searchKey.toLowerCase()) > -1;
});
deferred.resolve(results);
return deferred.promise;
},
findByManager: function (managerId) {
var deferred = $q.defer(),
results = employees.filter(function (element) {
return parseInt(managerId) === element.managerId;
});
deferred.resolve(results);
return deferred.promise;
}
}
});
这就是我尝试使用自己的json文件的方式：
angular.module('directory.services', [])
.factory('EmployeeService', function($q,$http) {
$http.get("http://localhost:3000/api/users").then(function(response){
myObject = response.data;
});
var employees = myObject;
// We use promises to make this api asynchronous. This is clearly not necessary when using in-memory data
// but it makes this service more flexible and plug-and-play. For example, you can now easily replace this
// service with a JSON service that gets its data from a remote server without having to changes anything
// in the modules invoking the data service since the api is already async.
return {
findAll: function() {
var deferred = $q.defer();
deferred.resolve(employees);
return deferred.promise;
},
findById: function(employeeId) {
var deferred = $q.defer();
var employee = employees[employeeId - 1];
deferred.resolve(employee);
return deferred.promise;
},
findByName: function(searchKey) {
var deferred = $q.defer();
var results = employees.filter(function(element) {
var fullName = element.firstName + " " + element.lastName;
return fullName.toLowerCase().indexOf(searchKey.toLowerCase()) > -1;
});
deferred.resolve(results);
return deferred.promise;
},
findByManager: function (managerId) {
var deferred = $q.defer(),
results = employees.filter(function (element) {
return parseInt(managerId) === element.managerId;
});
deferred.resolve(results);
return deferred.promise;
}
}
});
但它不起作用。
您在控制台中收到任何错误吗？也许这会有所帮助。
$http.get('path/to/api/users.json').success(function (data) {
var employees = data;
console.log("success");
})
.error(function () {
console.log("error getting json");
});
在您的EmployeeService中，此位有问题：
$http.get("http://localhost:3000/api/users").then(function(response){
myObject = response.data;
});
$http组件不使用promise .then()
你需要使用类似的东西
$http({
method: "get",
url: "some.url.com",
params: request_data // json object that will become get vars
})
.success(function(data) {
// result
})
.error(function(data, status) {
// fail
});
相关文章：
- HackReactor，编码窗口现在可以访问一个名为“”的对象;招生;使用名为“;showApp”;.调用此方法时不带任
- 编码为深度嵌套对象的 HTML 字段 json
- 查找与通过两次调用地理编码创建的两个 latlng 对象的距离
- 从url对对象进行角度编码和解码
- 我怎么能在IONIC应用程序中使用Json对象而不是硬编码对象呢
- PHP数组JSON编码和该对象在ExtJs中解码
- 将64位整数转换为json编码对象中的字符串的最佳实践
- 如何在 HTML5 Blob 对象上使用 base64 编码
- 如何从 PHP JSON 编码制作这个 JavaScript 对象
- Angular2 奇怪的硬编码对象与 http.get 对象问题
- 用于初始化对象的编码模式 - 构造函数(新）与 Object.create(）(Crockford）
- 在 Javascript 中将对象文本编码为 URL 查询字符串
- 如何将 JavaScript 对象编码为 JSON
- 对象 php 和 json 编码
- AJAX GET 未获取 JSON 编码的对象
- 在道场中编码，1.得到错误所有者文档 null 或不是对象，2.按钮标签更改后未更新
- 访问 JSON 编码对象的值
- AngularJS$resource正在将整个对象编码到URL中
- Javascript/jQuery对象编码问题
- 是否可以将javascript对象编码为javascript(而不是json）
