1

$scope変数から表示する html を追加したいと思います。angular-ui navbar 内に追加したい。生成されたコードはブラウザで確認すると完全に正しいのですが、追加の css スタイルがすべてを壊しているようです。

私のhtmlは次のようになります:

... navbar headers
<ul class="nav navbar-nav" ng-bind-html="menuHTML"></ul>

app.js は次のとおりです。

var myApp = angular.module('myApp', ['ui.bootstrap','ngSanitize']);



myApp.controller('NavBarCtrl', function($scope, $http, $window,$sce) {

    $scope.isCollapsed = true;

    $scope.changeLanguage = function (language){
        console.log(language);
        var url = $window.location.href;
        if (url.indexOf('?') > -1){
            url = url.substr(0,url.indexOf("?"));
            url += '?language='+language;
        }else{
            url += '?language='+language;
        }
        $window.location.replace(url);
    };

    $http.get('headerMenu').success(function(res){
        console.log('header ok');
        $scope.headerMenuHTML =  $sce.trustAsHtml(res);
    });


});

レンダリングされたページは期待どおりに見えますが、ドロップダウン メニューが機能しません。動作しない html をブラウザーからコピーし、手動で印刷せずにスタイルng-bind-htmlを削除すると、ng-bindingすべて問題ありません。

cssを追加せずにng-bind-htmlにhtmlを追加させるにはどうすればよいですか? もう1つの方法は、ここで回答されているように独自のディレクティブを作成することですが、コピーペーストされたコードは機能しません。おそらく質問の作成者はすべてを表示していないため、重要なモジュールを含めなかったり、セミコロンを見逃したり、コントローラーディレクティブの宣言順序を間違えたり(?)したりしました。

迷惑な余分な css なしで ng-bind-html を使用する方法、または正しい独自のディレクティブの例を提供する方法を誰か教えてもらえますか?

4

1 に答える 1

0

問題は、挿入された HTML に角度固有の要素が含まれているため、挿入後に HTML をコンパイルする特別なディレクティブを作成する必要があることでした。 スタックオーバーフローの回答に関する作業例。

于 2014-12-10T09:53:18.737 に答える