Javascript 如何以angularjs的方式执行以下jquery代码

我是angularjs的新手，想用angularjs的方式做以下事情

控制器

$scope.Filter = function($event, active, id) {
    html = "";
         if(active){
                    $http({method: 'GET', url: "someUrl.json"}).
                    success(function(data, status) {

                    html+="<p>Hey i am inside if block</p>";                    
                    });
    $("#results-display").html(html);

               }

  else{
         $http({method: 'GET', url: "someotherUrl.json"}).
                    success(function(data, status) {

                    html+="<p>Hey i am inside else block</p>";                  
});
 $("#results-display").html(html);
    }
}

$scope.Filter=函数（$event，active，id）{
html=“”；
如果（活动）{
$http（{method:'GET'，url:'someUrl.json}）。
成功（功能（数据、状态）{
html+=“嘿，我在里边，如果块
”；
});
$（“#结果显示”）.html（html）；
}
否则{
$http（{method:'GET'，url:'someotherUrl.json}）。
成功（功能（数据、状态）{
html+=“嘿，我在else块中
”；
});
$（“#结果显示”）.html（html）；
}
}

---

基本上，我使用了angularjs控制器，但我在控制器内部使用jquery方法，将json数据附加到

html

。如何以angularjs方式显示返回的json数据？

任何HTML操作都应该从控制器代码中省略。如果必须在代码中完成，则使用

但在您的情况下，不需要指令。要对示例进行角度化，只需设置一个scope属性（我将其命名为

isActive

），而是在标记中提供正确的HTML显示，因为scope模型是Javascript控制器代码和HTML视图之间的通信

Javascript 这段代码可以很容易地缩短，并且仍然可以做同样的事情

$scope.Filter = function($event, active, id) {
    $http({
        method: "GET",
        url: active ? "someUrl.json" : "someotherUrl.json"
    })
    .success(angular.bind(active, function(data, status) {
        $scope.isActive = this;
    }));
};

HTML 然后在HTML中简单地绑定到这个范围属性

<div id="results-display">
    <p ng-bind="activityText"></p>
</div>

这意味着无论何时更改

$scope.activityText

值（无论是在

.Filter

函数中还是在其他任何地方），它都会相应地反映在HTML中

---

您还可以使用

{}使用不同的表示法

但我更喜欢

ng bind

属性，因为它不要求您在Angular开始之前也在元素上放置

ng clope

。

您可以将数据放入$scope变量中，然后在视图中引用它们。我想将返回的数据插入

#results display

div标记中，如何做到这一点？在控制器集合$scope.yourData=data中可能类似于

<div id="results-display" ng-switch="isActive">
    <p ng-switch-when="true">Hey i am inside if block</p>
    <p ng-switch-when="false">Hey i am inside else block</p>
</div>

...
$scope.activityText = "Hey i am inside if block";
...

<div id="results-display">
    <p ng-bind="activityText"></p>
</div>