javascript - 在 ng-include 中重命名变量

标签 javascript angularjs

<分区>

这是相关的html:

<ng-include src="'app/views/order.html'"></ng-include>

附加到此 ng-include 嵌套的范围的是一个贸易变量。贸易变量看起来像:

var trade = {
    order: {}
}

问题是 order.html 需要一个订单变量而不是 trade.order

如何调用 ng-include 并将 trade.order 作为 order 传递?

最佳答案

ng-include 读取全局范围内的变量。你不能使用它。这是行不通的。

并且不要使用 onload,因为它会破坏全局范围。

更清洁的解决方案是制作 a new generic directive

这是理想的用法:

<div ng-include-template="'app/views/order.html'" ng-include-variables="{ order: trade.order }"></div>

指令是:

.directive(
  'ngIncludeTemplate'
  () ->
    {
      templateUrl: (elem, attrs) -> attrs.ngIncludeTemplate
      restrict: 'A'
      scope: {
        'ngIncludeVariables': '&'
      }
      link: (scope, elem, attrs) ->
        vars = scope.ngIncludeVariables()
        for key, value of vars
          scope[key] = value
    }
)

您可以看到指令没有使用全局范围。相反,它从 ng-include-variables 读取对象并将这些成员添加到它自己的本地范围。

希望对您有所帮助。它简洁而通用。

关于javascript - 在 ng-include 中重命名变量,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28909039/

相关文章:

javascript - AngularJS 忽略发布时禁用

javascript - 从选择中删除标签

javascript - 如何计算两个数字的最小值?

javascript - 无法在函数中设置未定义的属性

javascript - 使用 HTML2CANVAS 将 html 保存为图像

javascript - 获取两个 <a> 标签之间的字符串值

javascript - 排序后将子部分添加到正确的父部分 - Angular JS

angularjs - Safari 中的 Hammerjs : scroll issue

AngularJS - Angular UI-Router 仅重新加载嵌套 View ,而不是父 View

javascript - 下拉列表中的 Angular ng-repeat