3

私の問題は、Angular が ng-view 内で templateUrl を ($routeProvider を介して) ロードすると、すべての JavaScript も評価されないことです。私はそれを理解しようとしましたが、今私は本当に混乱しています。検索中に、たくさんの新しいトピックを見つけましたが、それらの中で迷ってしまいました。何か案が?

物語

他の誰かが以前にこの問題に遭遇したかどうか、またはこの問題の解決策があるかどうかを調べようとしました。私が見つけた方法は、「遅延読み込み」ディレクティブまたはrequirejsの使用のようなものでしたが、これらのツールが本当にこの問題を解決するかどうかはわかりません.

ブウ・グエンがこのスレッドで言及したように

それがjqLit​​eの仕組みです。テンプレート内のスクリプトを評価する場合は、AngularJS の前に jQuery を含めます。jQuery が含まれている場合、スクリプトが評価されます。jQuery を削除してみると、最初に確認された動作が表示されます。

angularjsの前にjqueryを含めてみましたが、まったく効果がありません。たとえば、私が読んだいくつかのスレッドがあります

しかし、解決につながるものは何もありません(多分私は何かを逃したかもしれません)。そして、これは私の問題でさえないと思います。javascript ファイルを (再) ロードしたくありません。ブートストラップを強制的に評価したいだけです。

正直今すごく迷っています。その後、初めてRequireJSに会いました。(遅延読み込み、そして友人たち)

YouTube でThomas Burleson のビデオを見たことがありますが、それが何であるかをほぼ理解しています。そして、トピックの記事をもっと見ました(興味があることがわかったので)が、解決策は別の場所にあるはずです。

状況はこちら

angularjs アプリに取り組んでいる間、部分的なサイトを別の .html ファイルとして作成しました (念のため)。次に、この .html ファイルを断片 (ヘッダー、トップメニュー、コンテンツ、フッター) に切り取り、その body タグを部分的な urlTemplate 内の div として使用します。

<body ng-app="myApp" id="page-top">

    <div class="wrapper">
        <div class="navigation">
            <div top-menu></div>
        </div>

        <div ng-view></div>

        <footer id="page-footer">
           <div class="container">
                 <span>Copyright © 2014. All Rights Reserved.</span>
                 <span class="pull-right"><a href="#page-top" class="roll">Go to top</a></span>
           </div>
        </footer>
    </div>
</body>

角度のある $routeprovider:

angular.module('myApp').config(['$routeProvider', function ($routeProvider) {
        $routeProvider.when('/', {
            templateUrl: 'main/templates/main.html'
        }).when('/ad-element', {
            templateUrl: 'submit/templates/submit.html'
        }).when('/404', {
            templateUrl: 'errors/templates/404.html'
        }).otherwise({
            redirectTo: '/404'
        });
    }]);

submit.html

<div class="page-sub-page page-submit">
    <div ng-controller="SubmitController" class="container">
          <form ...></form>
    </div>
</div>

すべての角度関数が機能しています。唯一の目に見える違いは外観です。

これは良いものです: 良い

そして、これは悪いものです: 悪い

4

0 に答える 0