2017-02-28 72 views
1

我開始使用puikinsh/gentelella管理模板的新AngularJS項目。ngInclude不從index.html加載腳本 - AngularJS

我將index.html中的內容部分提取到'dashboard'視圖中,並用ngView替換它。我使用ngInclude將側邊欄部分提取到'側邊欄'視圖中。

所有html成功加載,但現在側邊欄不能被點擊,也沒有加載'儀表板'視圖中的所有圖表。除了添加角度腳本之外,我沒有更改index.html中的任何腳本。

我試圖在角腳本之前放置jQuery腳本,但問題仍然存在。當我用視圖中的html代碼替換ngInclude和ngView時,邊欄工作正常,圖表也加載。

我缺少什麼?

附加:

我的代碼:plnkr.co/edit/gOlvOgzvNBcu9cMHBzfd

Getelella管理員主題演示:https://colorlib.com/polygon/gentelella/index.html

+0

請添加您的代碼 – mvermand

+0

@mvermand我加plunker鏈接到演示我的代碼。 –

+0

我認爲你需要剝奪你的掠奪者到問題的本質。 – mvermand

回答

0

我使用vue.js的完整渲染能力來編寫代碼,也會遇到這種情況;

我發現原因是

<!-- Custom Theme Scripts --> 
<script src="assets/theme/admin/gentelella/build/js/custom.min.js"></script> 
<!-- vue.js components compiled file --> 
<script src="{{ asset('js/app.js') }}"></script> 

現在我改變他們的順序,側邊欄的JS正在與底面:

<!-- vue.js components compiled file --> 
<script src="{{ asset('js/app.js') }}"></script> 
<!-- Custom Theme Scripts --> 
<script src="assets/theme/admin/gentelella/build/js/custom.min.js"></script> 

我認爲你還需要('.... custom.min.js')在您的js模板中,這可以與模板一起加載。

+0

我已將'custom.min.js'文件放在index.html底部。 –

+0

現在控制檯上是否有任何JS錯誤輸出?或者說沒有錯,但是JS不生效? – Fate

+0

控制檯中沒有錯誤。是的,JS不生效。 –

0

請從html標籤中刪除ng-app指令並將其放在body標籤上。 你可以看到輸出。

預覽plunker是在這裏: [例如plunker] [1]

[1]: http://plnkr.co/edit/smCHpD3QK0zmfxkUT3CM?p=preview 
+0

有什麼不同?側邊欄仍然無法工作。 –

+0

我想你還沒有完全檢查過它。請檢查我上面給出的鏈接,其工作完美。我認爲你正在觀看它,就像在蹲點中一樣。拖動它可以使輸出屏幕變大,並且您可以看到側欄工作正常。 –

+0

你說得對,關鍵在於我們是否放置了ng-app,你也可以將它放在HTML標籤上。謝謝 –