Question

我有一个指令，我试图根据注入指令的对象动态加载不同的部分

function countSummary() {
    var directive = {
        scope: {
            countData: '='
        },
        link: link,
        template: '<div ng-include=\'countData.countType === "expected" ? ' +                         '"/app/count/countsummary/countExpected.html" :' +
                   '"/app/count/countsummary/countBlind.html"\'>' +
                   '</div>'
    }
    return directive;

    function link(scope, element, attrs) { ... } 
}

我正在使用grunt-html2js转换要添加到$templateCache的所有html文件。我已经验证html文件已添加到$templateCache，但是当我加载页面时，它很难找到.html函数中引用的template文件。

这是一个时间问题吗？有没有更好的方法来使用模板功能？

Answer 1

ng-include参数需要评估为URL。我执行以下操作，当范围变量发生变化时，这将是动态的（使用ng-if指令将有条件地在视图之间切换）：

>> import nltk
>> nltk.word_tokenize("Tokenize me")
['Tokenize', 'me']

执行此操作的另一种方法是打开更多选项，即在链接函数中进行编译：

function countSummary() {
  var directive = {
    scope: {
      countData: '='
    },
    link: link,
    template: '<div ng-if="countData.countType === \'expected\'" ng-include="\'/app/count/countsummary/countExpected.html\'"></div>' +
    '<div ng-if="countData.countType !== \'expected\'" ng-include="\'/app/count/countsummary/countBlind.html\'"></div>'
  }
  return directive;

  function link(scope, element, attrs) { ... } 
}

使用ng-include和$ templateCache找不到文件

1 个答案: