1

AngularJS を使用して Chrome 拡張機能を作成しています。UI はブラウザー アクション ポップアップを介して提供され、コンテンツが変更されると、ポップアップのサイズを変更する必要が生じることがあります。私がこれを行うことができた唯一の方法は、クラスの条件付き更新を介して HTML および BODY タグの CSS サイズ属性を変更することです。

<!DOCTYPE html>
<html lang="en" ng-app="oApp" ng-controller="QuestionsCtrl" ng-class="{true:'expand'}[doExpand]">
<head>
...
</head>
<body ng-class="{true:'expand'}[doExpand]">
...

「doExpand」を設定するコントロールを ng-click すると、うまく機能します。ただし、ルーティングを使用して複数のビューを表示するようにアプリを更新しています。そうすることで、インラインコントローラー宣言を削除しています...

<!DOCTYPE html>
<html lang="en" ng-app="oApp" ng-class="{true:'expand'}[doExpand]">
...

...そしてルーティング設定でそれを定義します:

var oApp = angular.module('oApp', ['ngRoute', 'oControllers']);
oApp.config(['$routeProvider',
function($routeProvider) {
    $routeProvider.
    when('/login', {
        templateUrl: '/partials/login.html',
        controller: 'LoginCtrl'
    }).
    when('/board', {
        templateUrl: 'partials/board.html',
        controller: 'QuestionsCtrl'
    }).
    when('/board/:questionId', {
        templateUrl: 'partials/question-detail.html',
        controller: 'QuestionDetailCtrl'
    }).
    otherwise({
        redirectTo: '/login'
    });
}
]);

ルーティングは機能していますが、問題は、HTML タグがビュー自体にあるため、コントローラーの範囲外になっていることです。ビューに BODY タグを貼り付けることはできますが、HTML タグについては同じことを行うことはできません。なぜなら、JS のインクルードは head などにある必要があるためです (およびその他の理由)。

このシナリオを処理する方法について誰かアドバイスをもらえますか? ありがとうございました！

4

0 に答える 0