选择angularJS UI标签打印标签从抗衡 [英] angularJS UI tab print selected contend from tab

查看:135
本文介绍了选择angularJS UI标签打印标签从抗衡的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有嵌套angularJS标签和我的问题是我希望能够打印任何用户从父和子选项卡中选择的选择内容列表。当用户点击打印清单它打印全部网页?
http://plnkr.co/edit/8iYDDRaGHi2iNm0MWGfL?p=$p$pview

  $ scope.printEmployeeList =功能(divName){
    VAR printContents =的document.getElementById(divName).innerHTML;
    VAR popupWin = window.open('','_blank','宽= 800,高度= 700');
    popupWin.document.open();
    popupWin.document.write('< HTML>< HEAD><链接rel =stylesheet属性类型=文/ CSS的href =style.css文件/>< /头><身体的onload = window.print()>'+ printContents +'< / HTML>');
    popupWin.document.close();
}


您可以写上按一下按钮指令,它会给你所选选项卡的内容。

标记

 <按钮打印内容=内容>员工名单,LT; /按钮>

指令

  app.directive('printContent',函数($文件){
  返回{
    限制:'A',
    编译:功能(元素,ATTRS){
      element.on('点击',功能(事件){
        的console.log($ document.find('#'+ attrs.printContent).find()HTML()'tab-pane.active。');
        //你code添加打印code在这里
      });
    }
  }
});

工作Plunkr

I have nested angularJS tabs and my problem is I want to be able to print the select content list whatever user selected from parent and child tabs. when user click print list it print all page ? http://plnkr.co/edit/8iYDDRaGHi2iNm0MWGfL?p=preview

$scope.printEmployeeList = function (divName) {
    var printContents = document.getElementById(divName).innerHTML;
    var popupWin = window.open('', '_blank', 'width=800,height=700');
    popupWin.document.open();
    popupWin.document.write('<html><head><link rel="stylesheet" type="text/css" href="style.css" /></head><body onload="window.print()">' + printContents + '</html>');
    popupWin.document.close();
}

解决方案

You could write a directive on button click and it will give you the the content of selected tab.

Markup

<button print-content="content">Employee List</button>

Directive

app.directive('printContent', function($document) {
  return {
    restrict: 'A',
    compile: function(element, attrs) {
      element.on('click', function(event) {
        console.log($document.find('#'+ attrs.printContent).find('.tab-pane.active').html());
        //you code add your print code here
      });
    }
  }
});

Working Plunkr

这篇关于选择angularJS UI标签打印标签从抗衡的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆