【问题标题】:angularjs: using a directive inside the ui-bootstrap modalangularjs:在 ui-bootstrap 模式中使用指令
【发布时间】:2013-04-10 01:07:42
【问题描述】:

我不知道如何从使用 $dialog 服务创建的模式中调用指令。该指令还应该能够看到模态框上的按钮并覆盖它们的 ng-click 操作。

这是我的模态模板:

<div class="modal-header">
<h1>Rechercher</h1>
</div>
<div class="modal-body">

  <search-person></search-person>

</div>
<div class="modal-footer">
  <button ng-click="close(result)" class="btn btn-primary">Close</button>
</div>

searchPerson 指令模板:

<span>{{test}}</span>

searchPerson 指令本身:

angular.module('person.directives').directive("searchPerson", ['PersonService',    function (PersonService) {
return {
    restrict: "E",
    templateUrl: "person/views/searchPerson.html",
    scope: {},
    controller: 'searchPersonCtrl'
}
}]);

searchPerson 控制器:

angular.module('person.controllers').controller('searchPersonCtrl', ['$scope', function ($scope) {
   $scope.test = 2;    
}]);

最后是模态控制器:

 angular.module('person.controllers').controller('DialogController', ['$scope', 'dialog', function($scope, dialog) {
    $scope.test = 2;
    $scope.close = function (result) {
       alert('modal scope');
       dialog.close($scope.test);
    };
 }]);

那么如何让 searchPerson 控制器和模态控制器相互通信呢?

【问题讨论】:

    标签: angularjs angularjs-directive angular-ui-bootstrap


    【解决方案1】:

    我觉得我走得太远了。模态现在是指令的模板,而不是模态的模板和控制器,以及内部的指令。代码如下:

    <div class="modal-header">
    <h1>Rechercher</h1>
    </div>
    <div class="modal-body">
    
    <!-- this used to be the searchPerson directive but now the Modal and the directive are just the same directive -->
    <span>{{test}}</span>
    
    
    </div>
    <div class="modal-footer">
       <button ng-click="close(result)" class="btn btn-primary">Close</button>
    </div>
    

    【讨论】:

    • 我遇到了类似的问题。这对你有用吗??
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-04-22
    • 2013-08-19
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多