不懂AngularJS中的controller
Do not understand the controllers in Angular JS
这是一个我不习惯问的问题,但我觉得这是了解我正在努力解决的问题的唯一方法。如下所示,有两个函数 app.controller()
和 app.factory()
,对我来说它们似乎是相等的,即使我删除其中一部分函数也不会执行其预期任务。
Link to plunker: click here (相关文件是 script.js)
这两个函数有什么区别,为什么我不能只有其中一个?我知道必须有一个简单的解释。
app.controller('MainCtrl', ['$scope', 'ItemsService', function ($scope, ItemsService) {
$scope.newItem = { PlateNumber: '', Description: '', Price: 0 };
$scope.currentItem = null;
$scope.items = ItemsService.getItems();
$scope.addItem = function () {
ItemsService.addItem(angular.copy($scope.newItem));
$scope.newItem = { PlateNumber: '', Description: '', Price: 0 };
};
$scope.updateItem = function (id) {
ItemsService.updateItem(id);
};
$scope.removeItem = function (id) {
ItemsService.removeItem(id);
};
}]);
对
app.factory('ItemsService', ['$firebase', 'FIREBASE_URI', function ($firebase, FIREBASE_URI) {
var ref = new Firebase(FIREBASE_URI);
var items = $firebase(ref);
var getItems = function () {
return items;
};
var addItem = function (item) {
items.$add(item);
};
var updateItem = function (id) {
items.$save(id);
};
var removeItem = function (id) {
items.$remove(id);
};
return {
getItems: getItems,
addItem: addItem,
updateItem: updateItem,
removeItem: removeItem
}
}]);
控制器仅在您需要时实例化(您使用 ng-controller
或 controllerAs
)。因此,每次您切换到不同的路由或页面时,Angular 都会实例化一个控制器(它可以是已清理的同一控制器,例如,如果您刷新页面。)
Angular 提供程序,其中有几种主要类型 - 工厂是其中之一,是一种在应用程序的生命周期内保留数据甚至用于在不同控制器之间传递数据的方法。您的问题范围更像是:Provider vs Controller,而不是 Factory(一种类型)vs Controller。
在你上面的例子中,你有一个控制器,如果你有很多呢?如何在不一遍又一遍地编写相同代码的情况下将数据或实用程序函数传递给多个控制器?与供应商合二为一!
这里有一些不错的链接供您查看:
这是一个我不习惯问的问题,但我觉得这是了解我正在努力解决的问题的唯一方法。如下所示,有两个函数 app.controller()
和 app.factory()
,对我来说它们似乎是相等的,即使我删除其中一部分函数也不会执行其预期任务。
Link to plunker: click here (相关文件是 script.js)
这两个函数有什么区别,为什么我不能只有其中一个?我知道必须有一个简单的解释。
app.controller('MainCtrl', ['$scope', 'ItemsService', function ($scope, ItemsService) {
$scope.newItem = { PlateNumber: '', Description: '', Price: 0 };
$scope.currentItem = null;
$scope.items = ItemsService.getItems();
$scope.addItem = function () {
ItemsService.addItem(angular.copy($scope.newItem));
$scope.newItem = { PlateNumber: '', Description: '', Price: 0 };
};
$scope.updateItem = function (id) {
ItemsService.updateItem(id);
};
$scope.removeItem = function (id) {
ItemsService.removeItem(id);
};
}]);
对
app.factory('ItemsService', ['$firebase', 'FIREBASE_URI', function ($firebase, FIREBASE_URI) {
var ref = new Firebase(FIREBASE_URI);
var items = $firebase(ref);
var getItems = function () {
return items;
};
var addItem = function (item) {
items.$add(item);
};
var updateItem = function (id) {
items.$save(id);
};
var removeItem = function (id) {
items.$remove(id);
};
return {
getItems: getItems,
addItem: addItem,
updateItem: updateItem,
removeItem: removeItem
}
}]);
控制器仅在您需要时实例化(您使用 ng-controller
或 controllerAs
)。因此,每次您切换到不同的路由或页面时,Angular 都会实例化一个控制器(它可以是已清理的同一控制器,例如,如果您刷新页面。)
Angular 提供程序,其中有几种主要类型 - 工厂是其中之一,是一种在应用程序的生命周期内保留数据甚至用于在不同控制器之间传递数据的方法。您的问题范围更像是:Provider vs Controller,而不是 Factory(一种类型)vs Controller。
在你上面的例子中,你有一个控制器,如果你有很多呢?如何在不一遍又一遍地编写相同代码的情况下将数据或实用程序函数传递给多个控制器?与供应商合二为一!
这里有一些不错的链接供您查看: