自我指示沒有在角度模態下執行

我正在使用Angular UI Bootstrap模態來顯示自我形式指令，但是此指令未呈現。自我指示沒有在角度模態下執行

在self指令中，我寫了一段只顯示輸入元素的假html代碼。
它可以像預期的那樣顯示在主頁面中，但它在模式對話框中消失。

任何人都可以幫忙嗎？爲什麼模態對話框中的指令不顯示？

的代碼如下plunker： http://plnkr.co/edit/Qcy7eSf4abJ706VOSN5n?p=preview

的代碼片段也是如下：

var app = angular.module('modalExample', ['ui.bootstrap']); 
 
    app.directive('formView', [ 
 
     "$compile", 
 
     "$timeout", 
 
     function($compile, $timeout){ 
 
      return { 
 
       restrict: "E", 
 
       replace: true, 
 
       transclusion: true, 
 
       scope: { 
 
        config: "=" 
 
       }, 
 
       compile: function(element, attrs, transclude) { 
 
        return { 
 
         pre: function ($scope, iElement, iAttrs, controller) { 
 
          var fakeHtml = '<input type="text" ng-model="test"/>'; 
 
          angular.element(element).append($compile(fakeHtml)($scope)); 
 
         } 
 
        }; 
 
       } 
 
      }; 
 
     } 
 
    ]) 
 
    app.controller('modalController', ['$scope', '$uibModal', function($scope, $uibModal) { 
 
     $scope.open = function() { 
 
      var modalinstance = $uibModal.open({ 
 
       scope: $scope, 
 
       templateUrl: 'modal.html' 
 
      }) 
 
     }; 
 
    }]);

<!doctype html> 
 
<html ng-app="modalExample"> 
 
<head> 
 
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.js"></script> 
 
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular-animate.js"></script> 
 
    <script src="//angular-ui.github.io/bootstrap/ui-bootstrap-tpls-1.2.1.js"></script> 
 
    <script src="script.js"></script> 
 
    <link href="//netdna.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"> 
 
</head> 
 
<body> 
 

 
<div ng-controller="modalController"> 
 
    <script type="text/ng-template" id="modal.html"> 
 
    aaa <form-view></form-view> 
 
    </script> 
 
    
 
    <form-view></form-view> 
 
    <button type="button" ng-click="open()">Open Dialog</button> 
 
</div> 
 

 
</body> 
 
</html>

來源

2016-03-15 Lune

請更新您的指令就像如下─

app.directive('formView', [ 
     "$compile", 
     "$timeout", 
     function($compile, $timeout){ 
      return { 
       restrict: "E", 
       replace: true, 
       transclusion: true, 
       scope: { 
        config: "=" 
       }, 
       link: function ($scope, iElement, iAttrs, controller) { 
        var fakeHtml = '<input type="text" ng-model="test"/>'; 
         angular.element(iElement).append($compile(fakeHtml)($scope)); 
         } 


      }; 
     } 
    ]);

我希望這會幫助你。

來源

2016-03-15 06:39:21

它的作品，因爲我是新的角度，你可以分享一些評論嗎？爲什麼鏈接功能起作用？ – Lune

http://jasonmore.net/angular-js-directives-difference-controller-link/ –

自我指示沒有在角度模態下執行

回答

相關問題