AngularJS文档有关于$http success和error方法的弃用通知.这个抽象是从库中删除的具体原因吗？
我已经开始学习Angular JS了,我在向控制器中注入服务时遇到了问题.我正在尝试将ThreadFactory服务放入ThreadController,但是在调用它时我收到了一个未定义的错误.任何建议都会很棒.我得到的错误是:
未知提供者:$ scopeProvider < - $ scope < - ThreadService
app.js
angular.module('threadsApp', ['ngRoute']);
angular.module('threadsApp')
.config(function ($routeProvider, $locationProvider) {
$routeProvider
.when('/', {
templateUrl: 'views/index.html',
})
.when('/selected/:topicName', {
templateUrl: 'views/threads.html',
controller: 'ThreadController',
})
.otherwise({
redirectTo: "/"
});
$locationProvider.html5Mode(true);
});
ThreadController.js
angular.module('threadsApp').controller("ThreadController",
["$scope", "$route", "$routeParams", "ThreadService", function ($scope, $route, $routeParams, ThreadService) {
$scope.test = "Hello!";
$scope.test2 = ThreadService.get();
}]);
ThreadService.js
angular.module('threadsApp').service("ThreadService", ["$scope", function ($scope) {
return {
get: function() {
return "Hello";
}
}
}]);
进口顺序
<script src="bower_components/jquery/dist/jquery.js"></script> …我在StackOverflow上看到了人们建议为AngularJS服务提供回调函数的答案.
app.controller('tokenCtrl', function($scope, tokenService) {
tokenService.getTokens(function callbackFn(tokens) {
$scope.tokens = tokens;
});
});
app.factory('tokenService', function($http) {
var getTokens = function(callbackFn) {
$http.get('/api/tokens').then (function onFulfilled(response) {
callbackFn(response.data);
});
};
return {
getTokens: getTokens
};
});
在我看来,这似乎是一种反模式.该$http服务返回的承诺和具有.then方法执行回调函数感觉就像控制的不健康的反转.
如何重新编写这样的代码,以及如何解释为什么原始方式不是一个好主意？
当服务和控制器在一个文件中时(通常情况下app.js),我已经完成了这项工作,并且它没有任何问题.
现在,我将控制器和服务组织在不同的文件和相应的文件夹中.我需要在控制器中注入1个特定服务,但我遇到了错误.
这是一个我正在处理的简单角度应用,可以管理您最喜欢的YouTube视频.我在add页面上收到错误.只需单击"添加"按钮即可查看错误.
这是我到目前为止:
的index.html
<!doctype html>
<html ng-app="youtube-favorites">
<head>
<title>My YouTube Favorites</title>
<link rel="stylesheet" type="text/css" href="bower_components/bootstrap/dist/css/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" href="css/custom.css" />
</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-12" style="border: 1px solid red;">
<div ui-view></div>
</div>
</div>
</div>
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/angular-bootstrap/ui-bootstrap-tpls.min.js"></script>
<script src="bower_components/angular-ui-router/release/angular-ui-router.min.js"></script>
<script src="app.js"></script>
<script src="services/add.js"></script>
<script src="controllers/home.js"></script>
<script src="controllers/add.js"></script>
</body>
</html>
app.js
angular.module('youtube-favorites', ['ui.bootstrap', 'ui.router'])
.config(['$stateProvider', '$urlRouterProvider',
function($stateProvider, $urlRouterProvider) {
// For any unmatched url, redirect to /home
$urlRouterProvider.otherwise('/home');
// …我对以下代码的期望是它会绑定$ scope.as.但没有任何显示,控制台中没有显示错误
var testModule = angular.module('testmodule', [])
.controller('ctrl', function ($scope, mser) {
mser.aa();
})
.service('mser', function($scope /* Would $scope be here */) {
this.aa = function(){
$scope.as = "hello mars"
}});