我无法为自己澄清如何处理Angularjs中的$ scope。虽然我已经以其他方式解决了我当前的问题,但仍然需要帮助才能理解$ scope使用情况。
我有以下表格(本例简化)。的index.html:
<form class="form-horizontal" ng-controller="AddItemController as addItemCtrl">
<fieldset>
<legend>New item</legend>
<div class="form-group">
<label for="submittedBy" class="col-lg-2 control-label">Submitted by</label>
<div class="col-lg-10">
<input type="text" class="form-control" id="submittedBy" ng-model="addItemCtrl.item.submitted_by" placeholder="Your name here">
</div>
</div>
<div class="form-group">
<div class="col-lg-10 col-lg-offset-2">
<!--button class="btn btn-default">Cancel</button-->
<button type="submit" class="btn btn-primary" ng-click="addItemCtrl.addItem()">Submit</button>
</div>
</div>
</fieldset>
</form>
app.js:
app.controller("AddItemController", ['$scope','$http', function ($scope, $http) {
$scope.item = {};
this.addItem = function() {
$http({
url: "add_item",
method: "GET",
params: this.item
}).
success(function(data, status, headers, config) {
var table = angular.element($("#body")).scope();
table.items = data;
});
**this.item={};**
}
}]);
我想要的只是从表单中获取数据,将其发送到服务器,获取响应,更新表,然后清除表单。最后一部分是我的问题。我目前正在使用this.item={}
来处理它。但我确实想用$ scope调用它,所以它应该是$scope.item={}
然后我想在addItem
函数内移动它。不幸的是,它不适用于任何一种情况。
我有这个代码,它按预期工作,但似乎我很幸运/不幸在没有理解机制的情况下完成它。
app.controller('ItemController', ['$scope','$http', function ($scope, $http) {
function getItems(){
$http({
url: "get_items",
method: "GET"
}).
success(function(data, status, headers, config) {
$scope.items = data;
});
}
getItems();
}]);`
更新。这就是我的AddItemController目前的样子:
app.controller("AddItemController", ['$scope','$http', function ($scope, $http) {
$scope.item = {};
this.addItem = function() {
$http({
url: "add_item",
method: "GET",
params: this.item
}).
success(function(data, status, headers, config) {
$scope.$$prevSibling.items = data;
$scope.addItemCtrl.item={};
});
}
}]);
它的工作方式就像我想要的那样。但我不喜欢$scope.$$prevSibling.items = data;
语句,我用它来刷新由ItemController处理的表,有更优雅的方法吗?
答案 0 :(得分:2)
你不必编写getItem函数,你可以只编写$ http代码,它只会工作正常,大约$ scope,只是不要使用它,这里有点棘手,你想要的所有变量使用$ scope进行制作并从$ scope获取它
$scope.item;
$scope.item.getItem = function(){};
var item1 = $scope.item;
等等。