Question

我在使用简单的应用程序时遇到了麻烦，例如：

编译后

ng-click不起作用。

<!doctype html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>Example - example-compile-production</title>
  <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
</head>

<body ng-app="compileExample">
  <script>
    angular.module('compileExample', [], function($compileProvider) {
        // configure new 'compile' directive by passing a directive
        // factory function. The factory function injects the '$compile'
        $compileProvider.directive('compile', function($compile) {
          // directive factory creates a link function
          return function(scope, element, attrs) {
            scope.$watch(
              function(scope) {
                // watch the 'compile' expression for changes
                return scope.$eval(attrs.compile);
              },
              function(value) {
                // when the 'compile' expression changes
                // assign it into the current DOM
                element.html(value);

                // compile the new DOM and link it to the current
                // scope.
                // NOTE: we only compile .childNodes so that
                // we don't get into infinite loop compiling ourselves
                $compile(element.contents())(scope);
              }
            );
          };
        });
      })
      .controller('GreeterController', ['$scope', function($scope) {
        $scope.name = 'Visitor';
        $scope.html = 'Hello {{name}} have a look at <form><button ng-click="popFailed()">ng click which Failed</button></form> After successful request';

        $scope.popSuccess = function() {
          alert('pop success');
        };

        $scope.popFailed = function() {
          alert('test success');
        };
      }]);
  </script>
  <div ng-controller="GreeterController">
    <form>
      <button ng-click="popSuccess()">ng click which succed</button>
    </form>

    <br/>
    <input ng-model="name"> <br/>
    <textarea ng-model="html"></textarea> <br/><br/><br/><br>
    <div compile="html"></div>
  </div>

  <!-- Exemple of angularJs bootstrapping
        <script>
            // bootstrap the app to angular
            angular.bootstrap(document.getElementById('compile_example'), ['compile_example']);
        </script>
    -->
</body>
</html>

但是当我使用symfony提供生成我的模板的rest-api时（如$ scope.html），返回html字符串，如示例中所述。但我的ng-click不起作用。 EventListener，例如（ev）指示不会影响我的浏览器检查员

我正在使用带有id而非ng-app的angular.bootstrap作为我的申请声明

我需要帮助

我认为这是由于我在页面底部的angular.bootstrap位置
事件，例如（ev）指示在此示例中显示在浏览器检查器上，但不在我的项目上显示
如何知道html和指令是否已正确“编译”？在我的按钮表单上创建事件监听器apear

Answer 1

在那里解决了：

FOSRestBundle "avoid" Javascript eventListener

我在表单模板中犯了错误

试图使用$ compileProvider，CRUD和bootstraped指令ng-clink失败

1 个答案: