0

次の2つのディレクティブがあります。最初のもの (recentisls) は 2 番目のもの 'issuedesc' を作成します

directive('recentisls', function ($compile) {
        return {
            restrict: 'E',
            transclude: true,
            scope: {},
            controller: function ($scope, $element) {
                $scope.showIsDsc = function () {                    
                    var el = $compile("<issuedesc></issuedesc>")($scope);
                    $('body').html(el);
            },
            template: '<div ng-click="showIsDsc()"></div>',
        };
    }).

directive('issuedesc', function ($compile) {
        return {
            restrict: 'E',
            transclude: true,
            scope: {},
            controller: function ($scope, $element) {
                $scope.addcomts = function () {
                    alert("A Hello");                    
                };
            },
            template: '<input ng-click="addcomts()" type="button" value="Submit Comments"/>,
            replace: true
        };
    })

HTML コード -

<body>
<issuedesc></issuedesc>
</body>

ブラウザでは、issuedesc から作成されたボタンをクリックすると上記が機能します。

しかし、

<body>
<recentisls></recentisls>
</body>

ブラウザで、recentisls から作成されたボタンをクリックすると、上記が機能しません。

4

2 に答える 2

0

コントローラーは、$compile を使用して DOM を操作するのに適切な場所ではありません。これはリンク関数で行う必要があります。あなたの場合、実際にコンパイルする必要さえありません。ng-if をテンプレートに組み込むことができます:

<div ng-if="!issueDescriptionVisible" ng-click="showIsDsc()"></div>
<issuedesc ng-if="issueDescriptionVisible"></issuedesc>

次に、クリックハンドラーは次のようにします。

$scope.showIsDsc = function() {
   $scope.issueDescriptionVisible = true;
}
于 2013-10-31T06:24:11.580 に答える
0

構文エラーはほとんどありませんでした

app.directive('recentisls', function ($compile) {
    return {
        restrict: 'E',
        transclude: true,
        scope: {},
        controller: function ($scope, $element) {
            $scope.showIsDsc = function () {
                var el = $("<issuedesc></issuedesc>").appendTo('body');
                $compile(el)($scope)
            };

        },
        template: '<div ng-click="showIsDsc()">dd</div>'
    }
}).directive('issuedesc', function ($compile) {
    return {
        restrict: 'E',
        transclude: true,
        scope: {},
        controller: function ($scope, $element) {
            $scope.addcomts = function () {
                alert("A Hello");
            };
        },
        template: '<input ng-click="addcomts()" type="button" value="Submit Comments"/>',
        replace: true
    };
});

デモ:フィドル

于 2013-10-31T06:16:43.257 に答える