0

以下に示す AngularJS の例のようなディレクティブがあります。グローバル スコープからトグル メソッドを呼び出すにはどうすればよいですか? いくつかのレガシー コードからジッピーを切り替えられるようにしたいと考えています。

myApp.directive('zippy', 
function(){
    return {
        restrict: 'E',
        replace: true,
        transclude: true,
        scope: { title:'bind' },
        template:
        '<div class="zippy">' +
        '<div class="title">{{title}}</div>' +
        '<div class="body" ng-transclude></div>' +
        '</div>',
        link: function(scope, element, attrs) {
            var title = angular.element(element.children()[0]),
            opened = true;
            title.bind('click', toggle);
            function toggle() {
                opened = !opened;
                element.removeClass(opened ? 'closed' : 'opened');
                element.addClass(opened ? 'opened' : 'closed');
            }
            toggle();
        }
    }
});
4

1 に答える 1

4

レガシーを介してイベントにアクセスする場合は、次のように、angularから$applyメソッドを使用する必要があります。

function set_from_legacy(dom_element) {
    var scope = angular.element(dom_element).scope();
    scope.$apply(function() {
         scope.viewmodel_element.property1 = something;
         scope.viewmodel_element.property2 = somethingelse;
    });
}

次に、angularが起動し、ビューモデルに関連付けられたHTMLのプロパティを更新する必要があります。

たとえば、テンプレートを少し変更して、classNameがコントローラーのモデルzippyにバインドされるようにします（もちろん、それはzippyの配列である可能性があります）

お役に立てれば。

于 2012-10-14T15:27:42.880 に答える