Javascript 角度服务的多个实例
根据文件:角度服务是单例的 我正在创建一个时间跟踪项目,希望在其中添加多个任务Javascript 角度服务的多个实例,javascript,angularjs,Javascript,Angularjs,根据文件:角度服务是单例的 我正在创建一个时间跟踪项目,希望在其中添加多个任务 <ul> <li ng-repeat="item in data track by $index" > <label>Project Name</label> <input type="text" ng-model="item.project"/> <label>Start Time<
<ul>
<li ng-repeat="item in data track by $index" >
<label>Project Name</label>
<input type="text" ng-model="item.project"/>
<label>Start Time</label>
<input type="text" ng-model="item.start"/>
<label>End Time</label>
<input type="text" ng-model="item.finish"/>
</li>
</ul>
<a ng-click="addEntry();">Add Item</a>
还有我的服务
.service('Entry', [function(){
this.project = "";
this.start = "";
this.finish = "";
}]);
我的问题是,当我使用javascript构造函数时(jEntry)
对于创建新任务,它可以正常工作,而使用服务时,所有任务的行为都是绑定到单例的
所以我的问题是,执行这项任务的方式是什么
您可以让您的服务返回一个可实例化的函数
.service('Entry', [function(){
return function() {
this.project = "";
this.start = "";
this.finish = "";
}
}]);
像$scope.data.push(newentry())一样使用代码>
不过,这确实有点违背了提供服务的目的。您也可以在控制器内执行此操作
更好的方法是让服务跟踪条目(而不是直接将条目推入范围)
要跟踪服务中的条目,请执行以下操作:
知道条目是单例的,您可以将条目本身附加到单例,并添加方法来操作它们。像这样:
.service('Entry', [function(){
var self = this;
self.entries = [];
this.add = function() {
self.entries.push({
project: "",
start: "",
finish: ""
})
}
}]);
不再将entries对象添加到范围中,而是将整个条目附加到singleton:
$scope.data = Entry;
然后,ng click
功能将更改为data.add()
。此外,您现在可以循环使用数据.条目
,而不仅仅是条目
。这将允许您在其他控制器中使用条目
对象,同时保留其所有数据
这里有一个新的plunkr:
现在,您可以开始向Entry添加更多函数,例如,您可以添加RESTful方法来在DB中存储添加的内容。或者您可能需要删除条目的方法。“服务跟踪条目”您能建议我如何引用这些条目吗。添加了一个简单的示例
.service('Entry', [function(){
var self = this;
self.entries = [];
this.add = function() {
self.entries.push({
project: "",
start: "",
finish: ""
})
}
}]);
$scope.data = Entry;