我试图配置我的AngularJs的第一个花絮是一个微不足道的东西,但不幸的是,经过相当长的时间后,它没有成功.
我的前提:
用户从下拉列表中选择一个选项,并将相应的模板加载到选择下方的div中.我已经设置了服务,一个自定义指令(通过@Josh David Miller在这篇文章中关注ans ,以及一个控制器到位.服务中的ajax调用工作正常,除了我传递给服务器的params是硬编码的我希望这是用户选择的下拉列表中的"密钥".目前我没有将此代码传递给服务.
我的配置:
var firstModule = angular.module('myNgApp', []);
// service that will request a server for a template
firstModule.factory( 'katTplLoadingService', function ($http) {
return function() {
$http.get("${createLink(controller:'kats', action:'loadBreedInfo')}", {params:{'b1'}}
).success(function(template, status, headers, config){
return template
})
};
});
firstModule.controller('KatController', function($scope, katTplLoadingService) {
$scope.breed = {code:''}
// here I am unsuccessfully trying to set the user selected code to a var in service,
//var objService = new katTplLoadingService();
//objService.breedCode({code: $scope.breed.code});
$scope.loadBreedData = function(){
$scope.template = …我有一个AngularJS服务,它与服务器通信并返回应用程序不同部分的翻译:
angular
.module('utils')
.service('Translations', ['$q','$http',function($q, $http) {
translationsService = {
get: function(section) {
if (!promise) {
var q = $q.defer();
promise = $http
.get(
'/api/translations',
{
section: section
})
.success(function(data,status,headers,config) {
q.resolve(result.data);
})
.error(function(data,status,headers,config){
q.reject(status);
});
return q.promise;
}
}
};
return translationsService;
}]);
节的名称作为函数的section参数传递get.
我正在使用AngularJS ui-router模块并遵循此处描述的设计模式
所以我有以下状态配置:
angular.module('app')
.config(['$stateProvider', function($stateProvider) {
$stateProvider
.state('users', {
url: '/users',
resolve: {
translations: ['Translations',
function(Translations) {
return Translations.get('users');
}
]
},
templateUrl: '/app/users/list.html',
controller: 'usersController',
controllerAs: 'vm' …我有一个angular.js应用程序,我需要做CORS请求.
我想使用角度资源定义我的休息服务"angular",如下所述:http://docs.angularjs.org/tutorial/step_11.
但我还没有找到办法让这个工作.在谷歌上我发现了以下示例代码:http://jsfiddle.net/ricardohbin/E3YEt/,但这似乎不适用于角度资源.
这是我的app.js
'use strict';
angular.module('corsClientAngularApp', ['helloServices'])
.config(function ($routeProvider) {
$routeProvider
.when('/', {
templateUrl: 'views/main.html',
controller: 'MainCtrl'
})
.otherwise({
redirectTo: '/'
});
});
这是我的services.js与其他服务
angular.module('helloServices', ['ngResource']).
factory('Hello', function($resource){
return $resource('http://localhost:8080/cors-server/hello/:name', {}, {
query: {method:'GET', params:{name:'name'}, isArray:false}
});
});
这是我的main.js与控制器使用$ http,这是有效的!:
'use strict';
angular.module('corsClientAngularApp')
.controller('MainCtrl', function ($scope, $http, Hello) {
$http.defaults.useXDomain = true;
$http.get('http://localhost:8080/cors-server/hello/stijn')
.success(function(data) {
$scope.hello = data;
});
});
这是我使用角度资源的main.js的另一个版本.这不起作用:(
'use strict';
angular.module('corsClientAngularApp')
.controller('MainCtrl', function ($scope, $http, Hello) {
$http.defaults.useXDomain …关于此错误的其他帖子总是包括有人试图在不使用安全申请的情况下申请$,但在我的示例中并非如此.我的功能是成功返回我从API请求的数据,但我无法清除这个错误,这让我疯狂.每次在$ http函数中调用.success之前,我都会在控制台中看到"错误:[$ rootScope:inprog] $ digest已在进行中".以下是我的控制器和服务.谢谢!
这是我的服务,包括使用有效负载发布$ http呼叫的功能:
Services.service( 'CoolService', ['$q', '$rootScope', '$http', 'Auth', function($q, $rootScope, $http, Auth){
var service = {
create: function(payload){
var deferred = $q.defer();
$http({
'url': '/api/endpoint/',
'dataType':'json',
'method': 'POST',
data: payload
}).success(function(data,status, headers, config){
deferred.resolve(data);
})
.error(function(data, status, headers, config){
deferred.reject("Error in request.");
});
return deferred.promise;
}
}
return service;
}]);
这是我的控制器调用服务:
controllers.controller('CoolCtrl',['$scope', '$modal', '$log','CoolService', function($scope, $modal, $log, CoolService){
getCoolData = function (input_data) {
CoolService.create(input_data).then(function(results){
new_cool = results.results;
}, function(error){
console.log("there was an error getting new …angularjs angularjs-service angularjs-controller angularjs-http
我正在使用有效负载制作$ http DELETE请求,但内容类型错误.我有一个数据对象,但内容类型设置为text/plain而不是application/json.从下面的代码和下面的网络请求中可以看到,实际上有一个带有值的数据对象.有没有解决这个问题？非常感谢!
码:
$http({
method: "DELETE",
url: ".../v2/places/" + place.id + "/locations/remove",
data: location,
headers: { Authorization: "Bearer " + rootServices.getToken() }
})
chrome网络请求摘要:
远程地址:54.83.54.37:443
URL:../ v2/places/53b43e03e4b00cb25bcb16af/locations/remove
请求方法:DELETE
状态代码:500内部服务器错误请求
接受:application/json,text/plain,*/*
Accept-Encoding:gzip, deflate,sdch
Accept-Language:en-US,en; q = 0.8
授权:Bearer .....连接:keep-alive
内容长度:66
内容类型:text/plain; charset = UTF-8
主机:沙箱.... net
原产地:127.0.0.1:9000参考
:127.0.0.1:9000/session
用户代理:Mozilla/5.0(Windows NT 6.1; WOW64)AppleWebKit/537.36
(KHTML,类似Gecko)Chrome/35.0.1916.153 Safari /537.36请求
有效负载:{房间:厨房,设备:冰箱,地板:主
楼层}
Angularjs docs将$ controller服务的用法表示为:
$controller(constructor, locals);
任何人都可以关注这两点:
我正在学习Angular.js,我无法弄清楚这个简单的代码有什么问题.它看起来很好,但给我跟随错误.
**Error**: Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.3.14/$injector/modulerr?p0=app&p1=Error%3A%20…gleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.3.14%2Fangular.min.js%3A17%3A381)
在添加之前(我只是保留它)它给了我以下错误.这是为什么？ng-app="app"ng-app
Error: [ng:areq] http://errors.angularjs.org/1.3.14/ng/areq?p0=Ctrl&p1=not%20a%20function%2C%20got%20undefined
at Error (native)
at https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:6:417
at Sb (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:19:510)
at tb (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:20:78)
at $get (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:75:331)
at https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:57:65
at s (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:7:408)
at A (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:56:443)
at g (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:51:299)
at g (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:51:316)
<!doctype html>
<html ng-app="app">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
</head>
<body>
<div ng-controller="Ctrl">
<input ng-model="name">
<h1>{{name}}</h1>
<h2>{{age}}</h2>
</div>
<script>
var Ctrl = function($scope)
{
$scope.age = 24;
};
</script>
</body>
</html>
javascript angularjs angularjs-service angularjs-scope angularjs-controller
我正在使用socket.io在我的应用程序中启用聊天,我正在使用服务SocketService来执行所有套接字的东西.当消息出现时,我想从服务触发控制器的功能,以SocketService在UI中进行一些更改.所以我想知道如何从服务中访问控制器的功能.示例代码:
.service('SocketService', function ($http,$rootScope,$q) {
this.connect = function(){
var socket = io();
socket.on('connect',function(){
// Call a function named 'someFunction' in controller 'ChatController'
});
}
});
这是服务的示例代码.
现在是控制器的代码
.controller('ChatController',function('SocketService',$scope){
$scope.someFunction = function(){
// Some Code Here
}
});
events angularjs angularjs-service angularjs-controller angular-broadcast
我正在开发一个angularjs应用程序作为我的angularjs学习的一部分.我有控制器,从那里我打电话给服务层.
leagueManager.service("teamsService", function($http){
var teams = {};
$http.get('data/teams.json').then(function(data) {
teams = data;
});
this.getTeams = function(){
return teams;
};
});
我注意到由于$ http.get.then的异步性质,数据不会立即被检索,因此当我从控制器(teamsController)调用getTeams()时,我不会得到"团队",我会得到没有.
不知道如何解决这个问题？
第二次尝试: 在阅读下面的帖子建议的关于延迟和角度承诺之后,我尝试了以下但它仍然没有效果.我的变量团队没有按照我想要的方式进行填充,之后填充它们并且在我的UI中没有帮助:
我的控制器 teamController.js
leagueManager.controller('teamsController', function($scope, $location, teamsService, $routeParams){
//init function to initialize data when controller is called everytime.
var init = function(){
$scope.teams = [];
var promise = teamsService.getTeams();
promise.then(
function(data){
console.log("teams after promise:="+data);
$scope.teams = data;
}
,function(reason)
{
alert('Failed: ' + reason);
}
);
console.log("teams in the scope:="+$scope.teams);
};
init();
});
这是我的 …
我希望能够判断用户是否修改了$ resource实例 - 也就是说,它的当前状态是否与最初从服务器加载的状态不同&&尚未保存.我怎样才能做到这一点？