Javascript 如何在angular中使用$http服务添加部分页面功能？
我想在angular中使用$http服务成功加载部分页面后执行操作 操作是基于范围值选中复选框 请任何人帮帮我 源代码如下： 这是实际代码Javascript 如何在angular中使用$http服务添加部分页面功能？,javascript,jquery,angularjs,angularjs-scope,Javascript,Jquery,Angularjs,Angularjs Scope,我想在angular中使用$http服务成功加载部分页面后执行操作 操作是基于范围值选中复选框 请任何人帮帮我 源代码如下： 这是实际代码 $http({ url : './resources/staticPages/custom-object-filter.html', method : "GET" }).success(function(data, status) { $scope.data = data;
$http({
url : './resources/staticPages/custom-object-filter.html',
method : "GET"
}).success(function(data, status) {
$scope.data = data;
jQuery("objectViewPartial").html($compile($scope.data)($scope));
//console.log($scope.selected);
if(angular.equals($scope.selected, "ShowActivatedObjects")) {
$("#ShowActivatedObjects").attr('checked','true');
} else {
$("#ShowActivatedObjects").attr('checked','false');
}
}).error(function(data, status) {
console.log("some error occured partial page");
});
if(angular.equals($scope.selected, "ShowActivatedObjects")) {
$("#ShowActivatedObjects").attr('checked','true');
} else {
$("#ShowActivatedObjects").attr('checked','false');
}
请告知我需要将此代码放置在何处。您好，您的比较可能不好 if（angular.equals（$scope.selected，“ShowActivatedObjects”））{ 我不知道$scope.selected中的值是什么，但我认为这个值是一个复选框状态，它是布尔类型。所以您将布尔值与字符串进行比较
查看一个简短的Angularjs excursus: 一般来说，您应该尽可能减少在angularjs中使用jQuery，因为这两个概念是相互对立的。 Angularjs基于范围变量和模板表达式之间的绑定。因此，对于复选框，您可以在不使用jQuery的情况下轻松处理它，如下所示： 您可以在这里找到一个很好的解释： 这里您看到的是，i.ex.可以将复选框输入绑定到一个数组。如果您正在更改数组内容，复选框正在侦听并动态更改状态（选中或未选中），而无需检查它是否处于活动状态，也无需Jquery dom操作 我写了上面的解释，因为如果你将你的方式作为最佳实践，你会遇到大量的非结构化和不可读的代码。另外，我担心，你正在控制器函数中使用你的代码。在Angularjs中，控制器不用于dom操作，你应该只使用它来设置/更改范围变量或只是一个最小的业务逻辑（通常在这里避免！）业务逻辑应该进入服务，dom操作应该进入指令 您的问题： 请提供有关问题/逻辑的更多信息。请提供示例复选框，以及通过$http从服务器获取的示例信息 请提供你想要达到的目标。然后我们可以帮助你提供一个明确的答案 对不起，我知道这不是答案，但我不能添加评论，因为我是新来的 编辑 好的，谢谢你对@Likeee的评论，我想我明白了。你的页面上有一组复选框。在页面加载时，你想检查哪个复选框需要激活。在页面加载时，哪个复选框处于激活状态的逻辑来自服务器端，对吗？如果是，我将使用角度结构如下处理（为了更好地理解，我制作了一把小提琴：） 首先，您需要您的HTML：
<body ng-app="myApp" ng-controller="AppController">
<label ng-repeat="filter in productFilter">
<!--
simply checking if the array contains the entry. if not, it is not selected. On a click event, the selected item is added to the array.
-->
<input
type="checkbox"
value="{{filter}}"
ng-checked="selection.indexOf(filter) > -1"
ng-click="toggleSelection(filter)"/> {{filter}}
</label>
"selection Array within SelectionService": <br />{{selection}} <br /><br />
as you see, the array is also updating when you check or uncheck a box
</body>
$scope.productFilter=['Red pants'、'Green pants'、'Yellow pants'、'Blue pants']；$scope.selection = SelectionService.selection;
app.service("SelectionService", function ($http, $q) {
var obj = {
selection : ['Red pants', 'Blue pants'],
loadSelection : function(){
var that = this;
var deferred = $q.defer();
var config = {
responseType : "json",
cache: true
}
$http.get("/getSelectionFromServer", null, config)
.success(function(response){
if(response) {
// IMPORTANT: Use a deep copy, otherwise you will loose the binding
angular.copy(response,that.selection);
}
deferred.resolve(response);
})
.error(function(){
deferred.reject();
});
return deferred.promise;
},
addSelection : function (filter) {
this.selection.push(filter)
},
removeSelection : function (index) {
this.selection.splice(index, 1);
};
return obj;
});
在我的示例中，我不使用load方法，因为我这里没有任何服务器端脚本…我只接受初始化值。但您应该使用我的load方法。最后我实现了我的要求：
// $scope.getCustomObjectsBasedOnObjectTypeSelection = getCustomObjectsBasedOnObjectTypeSelection;
$scope.selected = ['Show All'];
var IsActive = "";
$scope.objectSelection = function objectSelection(objectType) {
var idx = $scope.selected.indexOf(objectType);
// is currently selected
if (idx > -1) {
$scope.selected.splice(idx, 1);
}
// is newly selected
else {
$scope.selected.push(objectType);
}
};
你能不能不使用像ng include这样的东西来实现所需的功能？你的代码看起来非常“无角度”。请建议如何实现？$scope.selected包含一个值数组。出于测试目的，我只传递该数组中的一个值。即使我也会传递直接值，例如..if（angular.equals）（“ShowActivatedObjects”，“ShowActivatedObjects”）。这也不起作用。请提供建议。谢谢..Gobian。我终于达到了我的要求。
/$scope.getCustomObjectsBasedOnObjectTypeSelection=getCustomObjectsBasedOnObjectTypeSelection；$scope.selected=['Show All']；var IsActive=“；$scope.objectSelection=函数objectSelection（objectType）{var idx=$scope.selected.indexOf（objectType）；//当前处于选中状态，如果（idx>-1）{$scope.selected.splice（idx，1）；}//是新选中的，否则{$scope.selected.push（objectType）；}；
// $scope.getCustomObjectsBasedOnObjectTypeSelection = getCustomObjectsBasedOnObjectTypeSelection;
$scope.selected = ['Show All'];
var IsActive = "";
$scope.objectSelection = function objectSelection(objectType) {
var idx = $scope.selected.indexOf(objectType);
// is currently selected
if (idx > -1) {
$scope.selected.splice(idx, 1);
}
// is newly selected
else {
$scope.selected.push(objectType);
}
};