使用 ui 引导程序与角度 1.5 es6 - 组件不起作用，去绑定参数未定义

Question

我正在使用角度 1.6 webpack es6 .

1 导入的引导程序如下(如何仅导入 moda？ 在应用中.js模块

import uiBootstrap from 'angular-ui-bootstrap';

2-呼叫UIBomodal从服务开放：

$uibModal.open({
animation: true,
backdrop:'static',
component: 'testModal',
windowClass: "class",
windowTopClass: "class2",
resolve: {
data: function(){
return data;
}
}})

3-创建了一个组件，例如：

class TestModalController{
constructor(){
console.log(this.resolve) . // got undefined
console.log(this.close) // got undefined
console.log(this.dismiss) // got undefined
}
$onInit(){
// not working also if i tryinh to get the binding here
}
}

const TestModalComponent = {
binding:{
resolve: '<',
close: '&',
dismiss: '&'
},
template: TestModalTemplate,
controller: TestModalController
};
export default TestModalComponent;

如果我打开 HTML，我看到生成了以下组件：

<test-modal resolve="$resolve" modal-instance="$uibModalInstance"
close="$close($value)" dismiss="$dismiss($value)"
class="ng-scope ng-isolate-scope"> ......</test-modal>

问题是我未定义并且无法绑定来自 uibmodal 的事件，例如关闭关闭或传递参数以返回到 uibmodal.result.then((

有一个例子如何做到这一点？

Answer 1

它是bindings，而不是binding。

$uibmodal支持这些绑定，因此预计这将起作用：

const TestModalComponent = {
bindings:{
resolve: '<',
close: '&',
dismiss: '&'
},
template: TestModalTemplate,
controller: TestModalController
};

正如在另一个答案中指出的那样，绑定应该不会出现在构造函数中，而是出现在$onInit钩子中，这就是它的用途。

Answer 2

依赖于存在的绑定的初始化逻辑应放在控制器的$onInit()方法中：

class TestModalController{
constructor(){
//NOT HERE
//console.log(this.resolve) // got undefined
//console.log(this.close) // got undefined
//console.log(this.dismiss) // got undefined
}
$onInit(){
//DO IT HERE
console.log(this.resolve) 
console.log(this.close) 
console.log(this.dismiss) 
}
}

从文档中：

bindToController

实例化控制器后，隔离作用域绑定的初始值将绑定到控制器属性。初始化后，您可以通过提供一个名为$onInit的控制器方法来访问这些绑定，该方法是在构造元素上的所有控制器并初始化其绑定后调用的。

— AngularJS 综合指令 API 参考 -bindToController