无法在角度项目中设置引导弹出窗口的宽度

问题描述:

有关此主题的几个*问题,但它们都不适合我。也许这与angular4有某种关系。无法在角度项目中设置引导弹出窗口的宽度

基本上我只是试图设置popover控件的宽度。

这是更好地理解问题的截图。

enter image description here

<a id="searchPopup" data-html="true" data-placement="auto left" data-container="body" data-toggle="popover"> 
    <span mdTooltip="Search another website worth" class="glyphicon glyphicon-search"> 
    </span> 
</a> 

<div id="popover-content" class="hide" style="width: 800px; max-width: 100%;"> 
    test test test test test test test test test test test test test 
    <table style="width:1000px;border:1px;"> 
    <tr> 
     <td> 
     test2 test2 test2 test2 test2 test2 test2 test2 test2 test2 test2 test2 
     </td> 
    </tr> 
    </table> 
</div> 

    ngOnInit() { 

    $('[data-toggle=popover]').popover({ 
     container: 'body', 
     html: true, 
     content: function() { 
     return $('#popover-content').html(); 
     } 
    }); 

    } 

.popover { 
     max-width: 100% !important; 
    } 

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
+0

我的事'afterViewInit'请尝试 –

+0

我尝试这样做,但是当我点击没有任何反应。我之后导入了ViewInit。 –

+0

你可以创建一个plunker –

最后,我已经解决了这个问题。 我刚将component.css文件中的css代码移动到styles.css文件中。 我不知道为什么它不能在组件CSS中工作。你需要编写方法

.popover { max-width: 100% !important;}