var myApp = angular.module('myApp', []);

myApp.controller('someController', function($scope) {
    $scope.click = function(){
        alert("asd");
    };

});
myApp.directive('testInput',function(){
     return {
          restrict: 'E',
          replace: false,
          transclude: false,
          template: '<div>asdasdasdasd</div>',
          controller: function($scope) {

         }
      };
});


HTML:

<div ng-app = "myApp" ng-controller = "someController">

    <div class = "clickme" ng-click ="click()">
        click me
    </div>

    <div id="container">
    </div>

</div>


如果不使用Jquery,是否有任何良好的Angular方法可将伪指令(testInput)附加到#container?
参见下面的jsfiddle链接
http://jsfiddle.net/4L6qbpoy/1/

最佳答案

更多的Angular方法是在控制器中将ngIf / ngShow与某些标志一起使用:



var myApp = angular.module('myApp', []);

myApp.controller('someController', function($scope) {
    $scope.click = function() {
        $scope.test = true;
    };
});

myApp.directive('testInput', function() {
    return {
        restrict: 'E',
        replace: false,
        transclude: false,
        template: '<div>asdasdasdasd</div>',
        controller: function($scope) {}
    };
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script>

<div ng-app="myApp" ng-controller="someController">

    <div class="clickme" ng-click="click()">click me</div>

    <div id="container">
        <test-input ng-if="test"></test-input>
    </div>

</div>

关于javascript - 如何在angularjs中将指令动态附加到div,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/32987611/

10-09 20:31