Javascript UI引导模式的控制器出现问题

我是个新手。我已经创建了一个带有模板（panel.html）和控制器（AllPanelsRetrieve）的组件。单击模板中定义的特定按钮时，将调用控制器中指定的showDetails（）函数。此函数触发打开由模板（panel list.details template.html）和控制器指定的模式对话框，这两者都是在allPanelsRetrieved控制器中定义的。问题是显示模式对话框，但控制器不工作（单击确定按钮不起作用）。问题出在哪里？提前谢谢

angular.
module('panelList')
.component('panelList', {
  templateUrl: '/panel-list/panel.html',
  controller: ['Panel', 'NgTableParams','$scope', '$location', '$uibModal',
   function PanelListController(Panel, NgTableParams, $scope, $location, $uibModal) {

  this.allPanelsRetrieved = (index, before) => {
  //..hidden code here  
  }

  this.showDetails = function () {
    $uibModal.open({
      templateUrl: '/panel-list/panel-list.details-template.html',
      controller: function ($uibModalInstance) {
        let $ctrl = this;
        $ctrl.ok = function () {
          $uibModalInstance.close();
        };
      },
    }).result.then(
      function (success) {
        alert(success);
      },
      function (error) {
        alert(error);
      }
    );
  };
 }]
});

以下是模板面板-list.details-template.html：

<div>
<script type="text/ng-template" id="/panel-list/panel-list.details-template.html">
        <div class="modal-header">
            <h3 class="modal-title">Modal title</h3>
        </div>
        <div class="modal-body">
            Modal content
        </div>
        <div class="modal-footer">
            <button class="btn btn-primary" ng-click="$ctrl.ok()">Close</button>
        </div>
</script>

情态标题
模态内容
接近

---

使用

$scope

使其以AngularJS的方式工作。以下是您试图实现的目标的一个示例

$uibModal.open({
    templateUrl: '/panel-list/panel-list.details-template.html',
    controller: function ($uibModalInstance, $scope) {
        $scope.ok = function () {
            $uibModalInstance.close();
        };
    }
}).result.then(
    function (success) {
        alert(success);
    },
    function (error) {
        alert(error);
    }
);

看法

情态标题
模态内容
接近

在使用该关键字时，问题在于该关键字。改用箭头功能，它将起作用：

$uibModal.open({
  templateUrl: '/panel-list/panel-list.details-template.html',
  controller: ($uibModalInstance) => {
    let $ctrl = this;
    $ctrl.ok = function () {
      $uibModalInstance.close();
    };
  },
})

---

而

angular.component

实现为

controllerAs

语法提供了默认值

controllerAs: identifierForController(options.controller) || options.controllerAs || '$ctrl',

…看起来angular ui引导程序没有

只需在$uibModal选项中为

controllerAs

提供一个值，即可继续使用首选语法

$uibModal.open({
  templateUrl: '/panel-list/panel-list.details-template.html',
  controllerAs: '$ctrl',
  controller: function($uibModalInstance) {
    let $ctrl = this;
    $ctrl.ok = function () {
      $uibModalInstance.close();
    }
  }

---

能否请您添加

面板列表.details template.html的代码？我刚刚添加了这是一项肮脏的工作，问题不在于使用范围或not@Yaser添加了一个工作示例，什么是“肮脏的工作”？我没说它不工作，它只是忽略了这个问题，并使用范围来解决它，而不是理解它为什么不能正常工作is@Yaser嗯，你需要理解AngularJS中的E2E绑定
$ctrl
在视图中不可用，因为它未通过双向数据绑定绑定。因此，
ng click=“$ctrl.ok（）”
将永远不会执行。这就是为什么我们在AngularJS中使用
$scope
，这是处理AngularJS中E2E绑定的干净方法。这不是你说的“肮脏”。我在这里浪费时间，你认为他们为什么从angular2删除了范围，甚至在添加组件和控制器之前？嗨，Yaser，不幸的是，这不起作用。无论如何谢谢你的帮助你在模态中设置了控制器吗@安托，你犯了什么错误？我没有犯任何错误。单击“关闭”按钮没有任何作用我会为你创建一个plunker，只需几分钟控制器不可能是箭头。
$uibModal.open({
  templateUrl: '/panel-list/panel-list.details-template.html',
  controllerAs: '$ctrl',
  controller: function($uibModalInstance) {
    let $ctrl = this;
    $ctrl.ok = function () {
      $uibModalInstance.close();
    }
  }