模型更改后角度视图未刷新

时间:2016-10-26 13:13:40

标签: angularjs view resources

早上好。

我有这个问题,过去一天我一直在努力。我正在开发一个发票应用程序,我在其中一个函数的模型更改后遇到了刷新问题。

一点背景 - 前端存储整个发票,包括客户数据,订单项和模型中的付款。更改此模型后,它将传递到后端,后端在发票上执行计算并将该模型返回到角度。 (我知道做计算客户端更好,但是有很多业务逻辑需要应用,所以我把它移到了后端。)所有的调用都按预期运行,并且视图更新没有任何问题,除了一个。我有一个功能,它采用对象的尺寸,并使用不同的产品给出不同的成本。用户可以选择他们想要购买的商品,并将其作为订单项添加到发票中。

什么工作/不工作 -

  • 视图使用空行项目更新;这是通过函数推入模型的。
  • 模型正在发送到服务器,正在处理并返回给客户端。
  • 未在客户端站点或视图上更新模型。

咖啡脚本:

$scope.addItem = (id, pop = false) ->
    if pop
      $scope.invoice.lines.push {
        'item_id': id
        'item_name': ''
        'count': $scope.cost.width + " x " + $scope.cost.height
        'cost': 0
        'sub_total': 0
      }
      $scope.invoice.time_stamp = new Date()
      tmpInv = EntryTemp.update({id: $userid}, { "invoice_data": { "data": $scope.invoice } }, (data) ->
        $scope.invoice = data
      )
    else
      tempItm = EntryItems.query({id: id}, (data) ->
        $scope.invoice.lines.push {
          'item_id': id
          'item_name': data.itemName
          'count': 0
          'cost': data.saleData.salePrice
          'sub_total': 0
        }
      )

  $scope.delItem = (item) ->
    index = $scope.invoice.lines.indexOf(item)
    $scope.invoice.lines.splice(index, 1)
    $scope.invoice.time_stamp = new Date()
    tempItm = EntryTemp.update({id: $userid}, { "invoice_data": { "data": $scope.invoice } }, (data) ->
      $scope.invoice = data
    )

  $scope.updateItem = () ->
    $scope.invoice.time_stamp = new Date()
    tempItm = EntryTemp.update({id: $userid}, { "invoice_data": { "data": $scope.invoice } }, (data) ->
      $scope.invoice = data
    )

问题功能是addItempop变量用于区分从价格比较工具添加的项目和标准菜单。

我应该提一下,当通过普通项目菜单添加项目时,它会被推送到发票模型,否则会在addItem中声明,但不会保存。用户更改计数后,模型将使用新订单项发送到服务器,并使用updateItem功能进行处理。 (这很好)

查看代码:(HAML)

%md-table-container
  %table{"md-progress" => "promise", "md-row-select" => "", "md-table" => ""}
    %thead{"md-head" => ""}
      %tr{"md-row" => ""}
        %th{"md-column" => ""}
        %th{"md-column" => ""}
          %span Item
        %th{"md-column" => ""}
          %span Count | Size
        %th{"md-column" => ""}
          %span Unit Price
        %th{"md-column" => ""}
          %span Cost
    %tbody{"md-body" => ""}
      %tr{"md-auto-select" => "", "md-row" => "", "md-select" => "dessert", "md-select-id" => "name", "ng-repeat" => "item in invoice.lines"}
        %td{"md-cell" => ""}
          %md-button.md-icon-button{'ng-click'=>'delItem(item)'}
            %md-icon.mdi.mdi-delete
        %td{"md-cell" => ""} {{item.item_name}}
        %td{"md-cell" => ""}
          %input{'ng-model' =>'item.count', :type=>'text', 'ng-blur'=>'updateItem()'}
        %td{"md-cell" => ""} ${{item.cost}}
        %td{"md-cell" => ""} ${{item.sub_total}}

我尝试了什么 -

  • 我尝试将$scope.invoice复制到tmp将新行推送到tmp并将tmp发送到数据服务。返回数据服务后,我将返回的数据应用于$scope.invoice。 (教授的是$digest()仍在处理$scope.invoice并且没有看到第二次更新,因此将其移动到另一个变量。
  • 我尝试过调用$scope.$apply(),但我收到了Digest is already running错误
  • 我已经尝试了$timeout到2000,以延迟帖子功能。

任何和所有的帮助都会很棒。

基于Sam的建议的代码 后端更新但视图没有 -

  $scope.addItem = (id, pop = false) ->
    if pop
      tmp = angular.copy($scope.invoice)
      tmp.lines.push {
        'item_id': id
        'item_name': ''
        'count': $scope.cost.width + " x " + $scope.cost.height
        'cost': 0
        'sub_total': 0
      }
      tmp.time_stamp = new Date()
      tmpInv = EntryTemp.update({id: $userid}, { "invoice_data": { "data": tmp } }, (data) ->
        $scope.invoice = data
      )
    else
      tempItm = EntryItems.query({id: id}, (data) ->
        $scope.invoice.lines.push {
          'item_id': id
          'item_name': data.itemName
          'count': 0
          'cost': data.saleData.salePrice
          'sub_total': 0
        }
      )

0 个答案:

没有答案