1

$compile で 1 つの問題に直面しています。私が書いたコードは非常に大きいので、この問題を再現するために 1 つの小さな例を作成します。私のページにボタンがあるとします。ユーザーがそのボタンをクリックすると、以下に示すように ng-click メソッドを持つもう 1 つのボタンが作成されます。

$scope.showAlert = function(){
       alert('pass'); 
    }
    $scope.createExample = function() {
          var button = '<button type="button" ng-click="' + $scope.showAlert + '()">click</button>';
          angular.element(document.body).append($compile(button)($scope));
    }

HTML:<button type="button" ng-click="createExample()">test</button>

ユーザーがボタンをクリックすると、createExample() メソッドが呼び出されます。このメソッドは、ng-click を持つ別のボタンを作成します。この ng-clicks には、アラートを出すメソッドが含まれています。

以下のエラーが発生します。

Error: Syntax Error: Token '{' is an unexpected token at column 12 of the expression [function (){
       alert('pass'); 
    }()] starting at [{
       alert('pass'); 
    }()].
    at Error (native)
    at throwError (https://code.angularjs.org/angular-1.0.1.js:5830:11)
    at parser (https://code.angularjs.org/angular-1.0.1.js:5824:5)
    at https://code.angularjs.org/angular-1.0.1.js:6387:29
    at https://code.angularjs.org/angular-1.0.1.js:12493:18
    at nodeLinkFn (https://code.angularjs.org/angular-1.0.1.js:4223:13)
    at compositeLinkFn (https://code.angularjs.org/angular-1.0.1.js:3838:14)
    at https://code.angularjs.org/angular-1.0.1.js:3750:30
    at Object.$scope.createExample (http://fiddle.jshell.net/JKBbV/751/show/:44:65)
    at https://code.angularjs.org/angular-1.0.1.js:6129:19 <button type="button" ng-click="function (){
       alert('pass'); 
    }()" class="ng-scope">

$compile は私が持っている唯一のオプションです。これを機能させる方法は??

JSFiddleここ

4

1 に答える 1

1

ng-click実行するハンドラー名を取得します。ここでは、メソッドの内容を評価しています。

正しいコードは次のようになります。

    $scope.showAlert = function(){
       alert('pass'); 
    }
    $scope.createExample = function() {
          var button = '<button type="button" ng-click="showAlert()">click</button>';
          angular.element(document.body).append($compile(button)($scope));
    }
于 2015-11-24T12:31:36.993 に答える