内容指令加载使用templateUrl

当我们有以下指令动态不显示：内容指令加载使用templateUrl

angular.module("MyApp") 
    .directive('documentViewer', function() { 
     return { 
      restrict: 'E', 
      link: function (scope, element, attrs) { 
      }, 
      templateUrl: "templates/documentViewer.tpl.html" 
     } 
    });

在页面上，我们有一个网格，在网格中的每一列有用户可以点击一个链接。当用户点击该链接，我们试图从页面的控制器内显示弹出：

self.viewDocument = function (docId) { 
    var title = "Document Viewer"; 
    var body = $compile('<document-viewer></document-viewer>')($scope); 
    showBootstrapModalDialog(title, body, true, true, false); 
};

在对Chrome浏览器开发工具的网络选项卡上，我可以看到指定的模板被获取，但是，内容不显示在弹出窗口中。你可以在这里看到：Screenshot of pop-up

这里是模板的内容：

<div> 
    document viewer template 
</div>

我缺少什么？

来源

2017-10-19 Joe Schmidt

为什么你需要使用$ compile？

这样的事情肯定做的伎俩

self.viewDocument = function (docId) { 
$scope.currentDoc = docId; 
}; 

<div> 
    ... 
    <document-viewer ng-if='currentDoc'></document-viewer> 
    ... 
</div>

来源

2017-10-19 16:50:32

感谢您的建议。只要点击一个链接，文档查看器的内容就会不同，这种方法只调用链接（）函数一次，内容不变，有什么想法？ –

将您需要的所有内容作为属性传递给指令。那些将可用的链接功能，你可以做任何你想要的东西。 <文档查看器attR1位= '富' attR2位= '酒吧' NG-如果= 'currentDoc'> –

我使documentId入指令，然而，链路函数只得到当第一个链接被点击时称为1次。点击另一个链接后，不会再次调用，该指令的内容与第一个链接点击的内容保持一致。 –

内容指令加载使用templateUrl

回答

相关问题