Angular不显示我在模板HTML页面中的控制器中设置的值

Question

我对angularjs相当陌生，并且我仍在控制器中使用jquery ajax调用。 是的，我最终会切换，但这是我的问题：

我的成功：

success: function (data) {
    var json = $.parseJSON(data);
    console.log(json);  // This correctly loops over EACH record and spits out the total record count,  thus the variable "json" indeed is called multiple time and logging to chrome debugger just fine
            $scope.commentResult = json;  // TRYING to just set this variable each time this $.ajax function is called within the success section 
            //angular.element('#commentCount').text(json);  // my attempt to set a span id text to the variable holding the value
        },....

我认为设置此范围值应该显示得很好

$scope.commentResult = json;

但是它没有出现

HTML页面我调用一个函数并传递一个不断变化的值tip.id {{setCommentCount（tip.id）}}

然后我尝试从控制器设置-上面的ajax调用

<span id="commentCount">Total Count: {{commentResult}}</span>

我这样做不正确吗？

因为我在页面上还有另一个地方正在做类似的事情

{{setTipId(tip.id)}}    

该函数调用正确地在循环中不断变化的tip.id中传递

然后我有设置$ scope.detailFrame

 ng-src="{{detailFrame}}"

因此它与ng-src一起用于其他元素...

显示更多的html和js代码

http://plnkr.co/edit/9PC3edazTsltk546RG4Z?p=catalogue

Answer 1

如果commentResult为json格式，请在模板中执行以下操作

{{ commentResult | json }}

在成功函数中，自己消化一个循环

$scope.$apply(function(){
    $scope.commentResult = json;
})

Answer 2

在将var分配给更新观察者之后，在成功回调中调用$scope.$apply() 。 并且不要在角度控制器中使用jquery ajax，这是一个坏习惯。使用$ http服务并承诺。 查看$ http service的文档。

这里