2

API からデータを取得するダイナミック ナビゲーション バーがあります。

問題は、ナビゲーション バーのリスト項目が一貫して切り替えられないことです。それは時々機能し、ほとんどの場合機能しません。

コンソール ウィンドウにスクリプト エラーはなく、クリーンです。

ナビゲーション パネルの切り替え用のスクリプトは、 layout.jsというファイル内の Metronic テンプレート自体からのものです。

角度がDOMでレンダリングされる前に、layout.jsが読み込まれることがあるため、私はそれを疑っています。その場合、トグルが正しく機能しません。

任意の提案をしてください!

ここに画像の説明を入力 

<!-- 1. Load libraries -->
    <!-- Polyfill(s) for older browsers -->
    <script src="/node_modules/core-js/client/shim.min.js"></script>    
    <script src="/node_modules/zone.js/dist/zone.js"></script>    
    <script src="/node_modules/systemjs/dist/system.src.js"></script>
    <!-- 2. Configure SystemJS -->
    <script src="/systemjs.config.js"></script>
    <script>
        System.import('app').catch(function (err) { console.error(err); });
    </script>

 <!-- BEGIN THEME LAYOUT SCRIPTS -->

    <script src="~/assets/layouts/layout/scripts/demo.min.js" defer type="text/javascript"></script>
    <script src="~/assets/layouts/global/scripts/quick-sidebar.min.js" defer type="text/javascript"></script>
    <script src="~/assets/layouts/global/scripts/quick-nav.min.js" defer type="text/javascript"></script>
    @*<script src="~/Scripts/jquery-1.10.2.min.js"></script>*@
    <script src="~/assets/global/plugins/bootstrap/js/bootstrap.min.js"></script>
    <script src="~/assets/layouts/layout/scripts/layout.js" defer></script>
    <!-- END THEME LAYOUT SCRIPTS -->
4

1 に答える 1

0

これを試して：

@angular/Core から AfterViewInit をインポートし、その機能を実装します。

angular-cli.json内のアプリのスクリプトで、layout.js が参照されていることを確認してください。

component.ts で、次のように layout.js をインポートします。

import {layout} from 'file/location/layout.js';

layout.js ファイルを編集して、現在のコードを次のようにラップします。

var extJs = (function() {
    return{
    getExtJs: function() {
        //js code goes here
    }
}

コンポーネントに戻り、layout.js の変数を参照する変数を宣言します。

declare var extJs: any;

ビューの読み込みが完了したら、layout.js 関数を呼び出します。

ngAfterViewInit(): void {
    extJs.getExtJs();
  }
于 2018-04-10T05:23:24.137 に答える