【问题标题】:Angular 1 bind data to a script templateAngular 1 将数据绑定到脚本模板
【发布时间】:2017-03-10 11:40:48
【问题描述】:

我仍然是一名即将到来的开发人员,我在这里遇到了问题。 我想将主模板中的项目绑定到脚本模板,该模板是通过 md-dialog 激活的表单。如何将外部模板中的数据绑定到脚本模板? 我想绑定主模板中的数据作为表单的占位符。

这是我的代码 sn-p。

ol(style="font-size: 14px; width: 100%; overflow-y: auto;")
            li(ng-repeat="action in rating.actions" style="margin-bottom: 1em;")
              div.action-items
                div <b>Task:</b> {{ action.task }}
                div <b>Owned by:</b> {{ action.owner }}
                div <b>Due date:</b> {{ action.due_date | date:'medium' }}
                div(ng-switch="action.status") <b>Status:</b> &nbsp;
                  span(ng-switch-when="unresolved" style="color:red;") {{ action.status }}
                     md-button.md-raised(ng-click="showConfirm($event, rating, action.id)" style="margin-left:7px; background-color:green; color:white; min-height: 23px !important; min-width: 46px !important; font-size: 10px !important; line-height: 0px;") Resolve Now
                  span(ng-switch-when="resolved" style="color:green;") {{ action.status }}&nbsp;
                    span(style="color: #757679") by {{ action.resolved_by }}
                a(href="" ng-click="showDelete($event, rating, action.id)")
                  i.fa.fa-trash-o(style="color:red; margin-right: 7px; font-size: 18px")
                a(href="" ng-click="showEdit($event, rating, action.id)")
                  i.fa.fa-pencil-square-o(style="color:black; margin-left: 7px; font-size: 18px")

        script(type="text/ng-template" id="dialogContent.tmpl.html")
          md-dialog(ng-cloak)
              md-dialog-content
                  form(name="editItem")
                  div(layout layout-sm="column")
                  md-input-container(flex)
                      label Task
                      input(ng-model="task" placeholder="{{action.task}}")
                  md-input-container(flex)
                      label Owned By
                      input(ng-model="owner")
                  md-datepicker(flex ng-model="date" md-placeholder="Due date")
                  div(style="margin: 0 auto; display: block; margin-bottom: 3px;")
                  md-button.md-raised.md-primary(ng-click="hide()" ng-controller="DashboardCtrl" type="submit" id="submit" style="margin: 0 auto; display: inline-block;") Confirm Edit
                  md-button.md-raised.md-primary(ng-click="closeDialog()" style="margin: 0 auto; display: inline-block;") Cancel

【问题讨论】:

    标签: javascript angularjs templates


    【解决方案1】:

    我不熟悉您使用的语言风格,但是,您需要使用您为脚本模板提供的 id。所以你有:

    script(type="text/ng-template" id="dialogContent.tmpl.html")
    

    因此,要将其与您的 ng-repeat 一起使用,您需要将行更改为:

    li(ng-repeat="action in rating.actions" style="margin-bottom: 1em;"
      ng-include="dialogContent.tmpl.html")
    

    然后每次重复都将使用您的脚本模板。

    【讨论】:

    • 非常感谢...让我试着回复你
    • 显然它不起作用。添加 ng-include 会使我的操作从他们的视图中消失。
    猜你喜欢
    • 1970-01-01
    • 2016-05-03
    • 1970-01-01
    • 1970-01-01
    • 2013-05-08
    • 1970-01-01
    • 1970-01-01
    • 2017-11-07
    • 1970-01-01
    相关资源
    最近更新 更多