我是新角色。我正在写一个简单的角度应用程序。我为该模块和工厂创建了一个模块和一个控制器。我将依赖项添加到控制器但是,我收到了一个注入器错误。我只是不明白我哪里出错了。
这是我的角度代码:
var app = angular.module("bookApp",[]);
app.config(['$interpolateProvider',function($interpolateProvider) {
$interpolateProvider.startSymbol('{[{');
$interpolateProvider.endSymbol('}]}');
}]);;app.controller("mainController",["$scope", "$http", "titles",function($scope, $http, titles){
$scope.titles = [{}];
titles.getTitles();
}]);
app.factory("titles",["$scope","$http",function($scope, $http){
var getTitles = function(){
$http.get("http://localhost:8000/getTitles")
.then(function(response) {
$scope.titles = response.data;
});
}
var addTitle = function(){
var data = $.param({
json: JSON.stringify({
title: $scope.book.bookname
})
});
$http.post("http://localhost:8000/addTitle",data).success(function(response, status){
$scope.titles = response.data;
});
}
return{
getTitles: getTitles
}
}]);
我的HTML:
<body ng-app="bookApp">
<div class="container">
<div>
<table id="recordTable" ng-controller="mainController">
<thead>
<tr>
<th>S.No</th>
<th>Name</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="title in titles">
<td>{[{title.id}]}</td>
<td>{[{title.bookname}]}</td>
</tr>
</tbody>
</table>
</div>
</div>
</body>
我收到以下错误:
http://errors.angularjs.org/1.5.7/$injector/unpr?p0=%24scopeProvider%20%3C-%20%24scope%20%3C-%20titles
我不明白这里的问题。 “标题”服务在那里,但它仍然给出了喷射器错误。
答案 0 :(得分:1)
基本上你已经在工厂内注入了$scope
,这是不可以在工厂内注入的。您必须从工厂Dependency数组中删除$scope
依赖项工厂代码。
如果你看一下工厂/服务的定义,它们就是sigletone 适用于整个申请的对象 角度的不同组件之间的共同功能 应用
您应该像下面那样彻底删除工厂范围,并且我在工厂中进行的主要更改将返回$http.get
方法的承诺对象。
<强>工厂强>
app.factory("titles",["$http",function($http){
var getTitles = function(){
return $http.get("http://localhost:8000/getTitles")
.then(function(response) {
return response.data;
});
}
var addTitle = function(book){
var data = $.param({
json: JSON.stringify({
title: book.bookname
})
});
return $http.post("http://localhost:8000/addTitle",data).success(function(response, status){
return response.data;
});
}
return{
getTitles: getTitles,
addTitle: addTitle
}
}]);
<强>控制器强>
app.controller("mainController",["$scope", "$http","titles",
function($scope, $http, titles){
//$scope.titles = [{}];
titles.getTitles().then(function(data){
$scope.titles = data;
});
}
]);