我有一个非常简单的angularjs组件,它有一个可选的高度绑定:
"use strict";
angular
.module("app")
.component("myComp", getComp());
function getComp() {
return {
bindings: getBindings(),
template: getTemplate(),
require: "ngModel",
controller,
};
}
function getBindings() {
return {
height: "<?",
noExternalFonts: "<?",
ngModel: "=",
}
}
function getTemplate() {
return `<summernote height="$ctrl.height" ng-model="$ctrl.ngModel" config="$ctrl.options"></summernote>`
}
function controller(chSummernoteService) {
const ctrl = this;
ctrl.chSummernoteService = chSummernoteService;
ctrl.$onInit = onInit.bind(ctrl);
}
function onInit() {
const ctrl = this;
ctrl.options = ctrl.chSummernoteService.getOptions({
noExternalFonts: ctrl.noExternalFonts,
});
}
问题是,当我调用它时,高度被模板中的指令summernote忽略,即使是其他两个属性, ng-model
及 options
干得好。
<my-comp height="400" ng-model="$ctrl.someOtherCtrl></my-comp>
我还检查并重播了 $ctrl.height
在带有硬编码编号的模板中,这确实有效。
这是我不知道的安格拉斯的怪癖吗(我对angularjs是新手,来自react)
或者这可能是summernote指令中的一个bug?
提前感谢您的帮助!
1条答案
按热度按时间ef1yzkbh1#
我查看了angular summernote src,它似乎被窃听了。他们的控制器写得不正确,以至于它读取
height
属性,所以它被字面解释为"$ctrl.height"
. 它的编写方式也是这样的,即使您试图在插值绑定之间强制它,它仍然会读取原始值,例如。height="{{ $ctrl.height }}"
也不行。幸运的是
config
属性被正确解析,根据文档,高度可以指定为该属性中的一个属性。因此,请移除height
元素中的属性,并在onInit
函数,将height属性添加到配置对象: