angular.js范围变量正在更新但视图不是

时间:2013-05-30 13:17:33

标签: angularjs angularjs-scope

我正在使用angular.js和rails作为我的后端,我在更新视图中的范围变量值时遇到了问题。在这里,我试图创建一个购物车类的东西。

html代码

<div class="modal hide fade" id="orderForm">
<div class="modal-header">
    <h3>
        Please enter your location details      <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
    </h3>
</div>
<div class="modal-body scrollable">
    <form accept-charset="UTF-8" class="simple_form form-horizontal" name="orderForm" novalidate="novalidate" ng-submit="validateAndSubmit(orderForm)"  id="order_form">
        <div class="control-group string optional order_full_name">
            <label class="string optional control-label" for="order_full_name">Full name</label>
            <div class="controls">
                <input class="string optional required  " id="order_full_name" name="full_name" ng-model="full_name" placeholder="eg. Kapil Sharma" size="50" type="text" value="">
                </div>
            </div>


</div>
<div class="modal-footer">
    <a href="" data-dismiss="modal" aria-hidden="true" class="btn">
        Close
    </a>
    <button type="submit" class="btn btn-success"> <i class="icon-ok"></i>&nbsp;Place order</button>
    <%# end %>
</form>
</div>

这是一个bootstrap模式,用$('#orderForm').modal('show');

调用

这是我的javascript角度代码。

$scope.validateAndSubmit = function(form){          
if(form.$valid){
    var formData = $('#order_form').serializeObject();; 

    $http.post('/create_order',{'order': formData})
    .success(function(data,status){
        $scope.currentOrder = data;
        $('#orderForm').modal('hide');
        $scope.currentOrder = [];
    }).error(function(data,status){
    //show error
        alert("error");
    });
}
else{
    alert("invalid form");
}

}

问题在于我的范围变量$scope.currentOrder,在所有其他函数中它工作正常但在validateAndSubmit方法中它没有根据需要更新视图我已经使用javascript {{1检查了范围变量的值方法

setInterval

更新的值在警报中很好,但视图没有更新值,请帮忙。提前谢谢。

1 个答案:

答案 0 :(得分:3)

看来回调是在作用域之外调用的,您需要在回调中添加$scope.$apply();,以便在需要更新视图时使用。{/ p>