'Unexpected token { at Function (<anonymous>)' 在 .pug 上运行迭代时出现错误答案

【问题标题】：'Unexpected token { at Function (<anonymous>)' error seen while running iteration on .pug'Unexpected token { at Function (<anonymous>)' 在 .pug 上运行迭代时出现错误
【发布时间】：2020-07-29 08:19:43
【问题描述】：

我想在单击选项时通过弹出屏幕显示字符串数组。我创建了模态服务并传递了元素。模态服务：

module.exports =
  function PopupModalServiceFactory($uibModal) {
    var service = {}

    var ModalInstanceCtrl = function($scope, $uibModalInstance, data) {
      $scope.data = data

      $scope.ok = function() {
        $uibModalInstance.close(true)
      }

      $scope.cancel = function() {
        $uibModalInstance.dismiss('cancel')
      }
    }

    service.open = function(data) {
      var modalInstance = $uibModal.open({
        template: require('./popup-modal.pug'),
        controller: ModalInstanceCtrl,
        size: data.size,
        animation: true,
        resolve: {
          data: function() {
            return data
          }
        }
      })

      return modalInstance.result
    }

    return service
  }

调用函数：

$scope.testFunction= function() {
    var updateMessage= ['1) This is Message 1111','2) This is message 2', '3) This is message 3'];
    PopupModalService.open({
      title: 'This is Title',
      details: updateMessage,
      cancel: false
    })
    
  }

popup-Modal.pug 文件

 .modal-header
    h4.modal-title.text-info
      i.fa.fa-info-circle
      .button-spacer
      span(translate) {{data.title}}   // Displays Title properly

  .modal-body
    label.control-label
      ul 
        each val, index in  {{data.details}} //Error Displayed here
         li= index + val

错误显示：

ERROR in ./Documents/.../app/components/stf/common-ui/modals/popup-modal/popup-modal.pug
Module build failed: SyntaxError: /home/superadmin/Documents/.../app/components/stf/common-ui/modals/popup-modal/popup-modal.pug:23

    21|     label.control-label
        22|       ul 
      > 23|         each val, index in  {{data.details}}
        24|          li= index + val
        25|         
        26| 
    
    Unexpected token {
        at Function (<anonymous>)

span(translate) {{data.details}} 将显示带括号的完整字符串，但对于“每个”循环，它不采用该值。如果我在 .pug 文件中对字符串数组进行硬编码，则列表将正确显示。对此问题的任何见解将不胜感激。谢谢！

【问题讨论】：

标签： angularjs pug

【解决方案1】：

我以前没有在 pug 中使用过 angular，但我怀疑问题是不应该在 Pug each 循环声明中使用插值。尝试将该循环更改为以下内容：

ul 
  each val, index in data.details
    li= index + val

【讨论】：