5

AngularJS フレームワークを使用して HTML アプリを構築しています。Angular オブジェクト内の関数にアクセスする必要がある古い JavaScript アクションがいくつかありますが、それを機能させることができません。
これは Angular オブジェクトです (アクセスする必要がある関数は です$scope.info()):

function content($scope) {
    $scope.info = function (id) {
        console.log('Got a call from '+id);
        $scope.text = "Hello, "+id;
    };
}

経由でアクセスしようとしましangular.element('content').scope().info('me')たが、結果はありませんでした (コンソールには と表示されますundefined)。の結果をダンプしようとしましたangular.element('content').scope()が、完全なオブジェクト リストとすべてを取得しました。理論的には、私の最初の例は機能するはずですが、機能しません。

これを達成する方法についてのガイダンスは大歓迎です!
(PS:レガシー コードから Angular JS を呼び出しても、これは解決されませんでした)。

最終的に関数にアクセスできたとき、期待どおりに機能しませんでした。値$scope.textは技術的に変更されていますが、HTML で使用されている式は更新されていません! たとえば、<p>{{text}}</p>この関数が外部関数から呼び出された後、 は更新されません。

これを修正する方法はありますか？

4

2 に答える 2

24

angular.element()DOM要素が必要なので、この html がある場合:

<div ng-controller="content">
</div>

その DOM 要素にアクセスするには、id を使用します。

<div id="myDiv" ng-controller="content">
</div>

それで

angular.element($('#myDiv')).scope().info('me')

またはjQueryなし：

angular.element(document.getElementById('myDiv')).scope().info('me')

動作するはずです。

編集：

スコープで何かを変更した場合は、おそらく$apply()を使用する必要があります。

angular.element(document.getElementById('myDiv')).scope().$apply();
于 2013-01-12T22:21:07.200 に答える
0

私にとっては、(別のウィンドウで) コールバックから角度の値にアクセス/設定しようとしていました。解決策は、jQuery のdataメソッドを使用することでした。dataAPI を使用すると、オブジェクト リテラルを DOM ノードにアタッチできます。したがって、グローバル変数のようなもの (これも機能します) に頼る代わりに、次のようなことを行います。

/**
 * Listen to a global "lookupTemplate" event
 */
$j(document).on("lookupTemplate", function(event, template) {
        $j(document).data("template", template);
        window.open("/callbackURL", 'Callback Window', 'status=0,toolbar=0,height=230,width=358');
    });

/**
* Callback from other window, to change template ID and name (it's global)
* @param {String} template_id the ID for the selected template from the other window
* @param {String} template_name the name for the selected template from the other window
*/
function templateChosen(template_id, template_name) {
    var template = $(document).data("template");
    var appendedSelector = "[" + template.index + "]";
    $('[name="templateId' + appendedSelector + '"').val(template_id);
    $('[name="templateName' + appendedSelector + '"').val(template_name);
    // Update angular vars just in case
    template.id = template_id;
    template.name = template_name;
}

var app = angular.module("app", []).controller("ActionsController", function($scope) {
        $scope.actions = [];
        $scope.lookupTemplate = function(index) {
            $scope.actions[index].template.index = index;
            $(document).trigger("lookupTemplate", $scope.actions[index].template);
        }
    }
);

Angular に含まれるヘルパーを使用して、nameそれぞれの新しい属性をインクリメントします。action{{index}}

于 2014-12-10T23:56:28.520 に答える